Separate accessory replenishment queue

src/pages/Supplies.tsx

@@ -114,7 +114,7 @@ const receiptCategories: Array<{ name: string; icon: typeof Package }> = [
   { name: 'Outro material', icon: ClipboardList },
 ];
 
-type DemandQueue = 'apparel' | 'inputs' | 'review' | 'dead';
+type DemandQueue = 'apparel' | 'accessories' | 'inputs' | 'review' | 'dead';
 
 type DemandRow = ProductAnalyticsItem & {
   productType: ProductTypeKey;
@@ -130,6 +130,7 @@ type DemandRow = ProductAnalyticsItem & {
 
 const demandQueueLabels: Record<DemandQueue, string> = {
   apparel: 'Cortar / Repor',
+  accessories: 'Repor acessórios',
   inputs: 'Comprar insumos',
   review: 'Revisar dados',
   dead: 'Estoque parado',
@@ -137,12 +138,13 @@ const demandQueueLabels: Record<DemandQueue, string> = {
 
 const demandQueueDescriptions: Record<DemandQueue, string> = {
   apparel: 'Produtos acabados com demanda ativa e cobertura abaixo da meta.',
-  inputs: 'Insumos, embalagens e matérias-primas com necessidade de reposição.',
+  accessories: 'Acessórios acabados com demanda ativa e cobertura abaixo da meta.',
+  inputs: 'Embalagens, matérias-primas e insumos de produção com necessidade de reposição.',
   review: 'SKUs com informações pendentes para qualificar o planejamento.',
   dead: 'Itens com saldo disponível e baixa movimentação no período.',
 };
 
-const directPurchaseTypes = new Set<ProductTypeKey>(['packaging', 'dtf_input', 'raw_material', 'machine_part', 'finished_accessory']);
+const directPurchaseTypes = new Set<ProductTypeKey>(['packaging', 'dtf_input', 'raw_material', 'machine_part']);
 
 const planningReviewTypes = new Set<ProductTypeKey>(['unknown', 'kit_bundle']);
 
@@ -247,6 +249,8 @@ const buildDemandRow = (
     queue = 'review';
   } else if (productType === 'finished_apparel') {
     queue = 'apparel';
+  } else if (productType === 'finished_accessory') {
+    queue = 'accessories';
   } else if (directPurchaseTypes.has(productType)) {
     queue = 'inputs';
   }
@@ -342,7 +346,7 @@ const DemandPlanningScreen = () => {
         return row.dailySales > 0 && (row.suggestedUnits > 0 || (row.daysOfCover !== null && row.daysOfCover <= targetCoverageDays));
       }).length;
       return acc;
-    }, { apparel: 0, inputs: 0, review: 0, dead: 0 });
+    }, { apparel: 0, accessories: 0, inputs: 0, review: 0, dead: 0 });
   }, [rows, targetCoverageDays]);
 
   const totalPages = Math.ceil(queueRows.length / itemsPerPage);
@@ -364,7 +368,7 @@ const DemandPlanningScreen = () => {
         />
       </div>
 
-      <div className="grid grid-cols-1 gap-3 md:grid-cols-4">
+      <div className="grid grid-cols-1 gap-3 md:grid-cols-2 xl:grid-cols-5">
         {(Object.keys(demandQueueLabels) as DemandQueue[]).map(item => (
           <button
             key={item}