/* V396 — Mobile professional layout for Phân tích nhu cầu
   Scoped to demand-strategy only; desktop behavior from V395 remains unchanged. */
@media (max-width: 800px){
  .v363-page{width:100%;max-width:100%;overflow:hidden}

  .v363-hero{margin:12px 0 10px;padding:15px 14px;gap:12px;border-radius:14px}
  .v363-kicker{font-size:9px;line-height:1.4}
  .v363-hero h2{margin-top:6px;font-size:19px;line-height:1.22}
  .v363-hero p{font-size:11px;line-height:1.55}
  .v363-period{grid-template-columns:88px minmax(0,1fr);align-items:center;gap:9px;padding-top:2px}
  .v363-period span{font-size:10px}
  .v363-period select{width:100%;height:42px;font-size:12px;border-radius:9px}

  .v363-kpis{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-bottom:10px}
  .v363-kpis article{min-height:92px;padding:11px 10px;border-radius:11px;box-shadow:0 2px 10px rgba(15,23,42,.045)}
  .v363-kpis span{font-size:8.5px;line-height:1.35;letter-spacing:.035em}
  .v363-kpis strong{margin-top:7px;font-size:14px;line-height:1.25;white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
  .v363-kpis small{font-size:9px;line-height:1.35}
  .v363-kpis article.revenue{grid-column:1/-1;min-height:auto}

  .v363-panel{border-radius:14px;overflow:hidden}
  .v363-toolbar{display:block;padding:13px 12px 12px}
  .v363-toolbar h3{font-size:14px;line-height:1.3}
  .v363-toolbar p{font-size:10px;line-height:1.45}
  .v363-tools{display:grid;grid-template-columns:minmax(0,1fr) 104px;gap:8px;margin-top:11px}
  .v363-tools input{grid-column:1/-1;width:100%;height:42px;padding:0 12px;font-size:12px;border-radius:9px}
  .v363-tools select,.v363-tools button{width:100%;height:40px;font-size:10.5px;border-radius:9px}

  /* Main demand table -> mobile cards */
  .v363-table-wrap{overflow:visible;padding:10px;background:#f5f7f9}
  .v363-table{display:block;width:100%;min-width:0;border:0;background:transparent}
  .v363-table thead{display:none}
  .v363-table tbody{display:grid;gap:10px}
  .v363-table tbody tr{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0;overflow:hidden;border:1px solid #dde3e8;border-radius:13px;background:#fff;box-shadow:0 2px 9px rgba(15,23,42,.045)}
  .v363-table tbody tr:hover{background:#fff}
  .v363-table td{display:block;min-width:0;padding:9px 10px;border:0;border-top:1px solid #edf0f2;vertical-align:top;text-align:left!important}
  .v363-table td::before{display:block;margin-bottom:4px;font-size:7.8px;font-weight:900;line-height:1.2;letter-spacing:.055em;text-transform:uppercase;color:#87919d}
  .v363-table td:nth-child(1){grid-column:1/-1;padding:12px 11px 10px;border-top:0;background:#fbfcfd}
  .v363-table td:nth-child(1)::before{content:"Sản phẩm"}
  .v363-table td:nth-child(2)::before{content:"Khách mua"}
  .v363-table td:nth-child(3)::before{content:"Nhóm mua chính"}
  .v363-table td:nth-child(4)::before{content:"SL bán"}
  .v363-table td:nth-child(5)::before{content:"Tháng cao điểm"}
  .v363-table td:nth-child(6)::before{content:"Xu hướng 3T"}
  .v363-table td:nth-child(7)::before{content:"Tồn hiện tại"}
  .v363-table td:nth-child(8)::before{content:"Đủ bán"}
  .v363-table td:nth-child(9){grid-column:1/-1}
  .v363-table td:nth-child(9)::before{content:"Giá nhập so với trung bình"}
  .v363-table td:nth-child(10){grid-column:1/-1;background:#f7fbf9}
  .v363-table td:nth-child(10)::before{content:"Đề xuất dự trữ";color:#2d7b68}
  .v363-table td:nth-child(11){grid-column:1/-1;padding-top:8px;padding-bottom:11px}
  .v363-table td:nth-child(11)::before{content:"Đánh giá"}
  .v363-product{min-width:0}
  .v363-product strong{font-size:13px;line-height:1.35;color:#172033}
  .v363-product small{margin-top:3px;font-size:9.5px}
  .v363-type strong,.v363-number strong,.v363-peak-cell strong,.v363-cover strong,.v363-suggest strong,.v363-cost strong,.v363-center strong{font-size:11.5px;line-height:1.35}
  .v363-type small,.v363-number small,.v363-peak-cell small,.v363-cover small,.v363-suggest small,.v363-cost small,.v363-center small{font-size:9px;line-height:1.35}
  .v363-number,.v363-cover,.v363-suggest,.v363-cost,.v363-center{text-align:left}
  .v363-growth,.v363-status{min-height:25px;padding:4px 8px;font-size:9.5px}

  .v363-pagination{display:grid;gap:9px;padding:11px 10px;text-align:center;font-size:9.8px}
  .v363-pagination>div:last-child{display:grid;grid-template-columns:1fr 1fr;gap:7px}
  .v363-pagination select,.v363-pagination button{width:100%;height:36px;font-size:10px;border-radius:8px}
  .v363-pagination span{grid-column:1/-1;grid-row:1;min-width:0;padding:3px 0}

  /* Regional demand block */
  .v365-region-section{border-radius:14px}
  .v365-region-head{display:block;padding:13px 12px}
  .v365-region-head h3{font-size:14px;line-height:1.35}
  .v365-region-head p{font-size:10px;line-height:1.5}
  .v365-region-filter{width:100%;min-width:0;margin-top:10px}
  .v365-region-filter select{width:100%;height:42px;font-size:12px;border-radius:9px}
  .v365-region-kpis{grid-template-columns:1fr;gap:8px;padding:10px}
  .v365-region-kpis article{padding:10px 11px;border-radius:11px}
  .v365-region-kpis strong{font-size:14px;white-space:normal;line-height:1.3}

  .v365-region-table-wrap{overflow:visible;padding:10px;background:#f5f7f9}
  .v365-region-table{display:block;width:100%;min-width:0;border:0;background:transparent}
  .v365-region-table thead{display:none}
  .v365-region-table tbody{display:grid;gap:10px}
  .v365-region-table tbody tr{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));overflow:hidden;border:1px solid #dde3e8;border-radius:13px;background:#fff;box-shadow:0 2px 9px rgba(15,23,42,.045)}
  .v365-region-table tbody tr:hover{background:#fff}
  .v365-region-table td{display:block;min-width:0;padding:9px 10px;border:0;border-top:1px solid #edf0f2;text-align:left!important;vertical-align:top}
  .v365-region-table td::before{display:block;margin-bottom:4px;font-size:7.8px;font-weight:900;line-height:1.2;letter-spacing:.055em;text-transform:uppercase;color:#87919d}
  .v365-region-table td:nth-child(1){grid-column:1/-1;padding:10px 11px;border-top:0;background:#f6f9fc}
  .v365-region-table td:nth-child(1)::before{content:"Khu vực"}
  .v365-region-table td:nth-child(2){grid-column:1/-1}
  .v365-region-table td:nth-child(2)::before{content:"Sản phẩm"}
  .v365-region-table td:nth-child(3)::before{content:"Khách mua"}
  .v365-region-table td:nth-child(4)::before{content:"Số đơn"}
  .v365-region-table td:nth-child(5)::before{content:"SL đã mua"}
  .v365-region-table td:nth-child(6)::before{content:"BQ / đơn"}
  .v365-region-table td:nth-child(7){grid-column:1/-1;background:#f7fbf9}
  .v365-region-table td:nth-child(7)::before{content:"Doanh thu";color:#2d7b68}
  .v365-region-table td:nth-child(8)::before{content:"Tỷ trọng khu vực"}
  .v365-region-table td:nth-child(9)::before{content:"Tháng cao điểm"}
  .v365-region-product{min-width:0!important;text-align:left!important}
  .v365-region-product strong{font-size:12.5px;line-height:1.35}
  .v365-region-table td,.v365-region-table td strong{font-size:11px;line-height:1.35}
  .v365-region-table td small{font-size:9px}

  .v365-region-pagination{display:grid;gap:9px;padding:11px 10px;text-align:center;font-size:9.8px}
  .v365-region-pagination>div:last-child{display:grid;grid-template-columns:1fr 1fr;gap:7px}
  .v365-region-pagination select,.v365-region-pagination button{width:100%;height:36px;font-size:10px;border-radius:8px}
  .v365-region-pagination span{grid-column:1/-1;grid-row:1;min-width:0;padding:3px 0}

  .v363-method{margin-top:10px;padding:13px 12px;border-radius:12px}
  .v363-method h3{font-size:12px}
  .v363-method>div{grid-template-columns:1fr;gap:8px}
  .v363-method p{padding:8px 9px;border-radius:8px;background:rgba(255,255,255,.62);font-size:10px;line-height:1.5}
}

@media (max-width: 390px){
  .v363-kpis{grid-template-columns:1fr}
  .v363-kpis article.revenue{grid-column:auto}
  .v363-tools{grid-template-columns:1fr}
  .v363-tools input{grid-column:auto}
  .v363-table tbody tr,.v365-region-table tbody tr{grid-template-columns:1fr}
  .v363-table td,.v363-table td:nth-child(n),.v365-region-table td,.v365-region-table td:nth-child(n){grid-column:1/-1}
}

/* Dark mode parity */
@media (max-width:800px){
  .dark .v363-table-wrap,.dark .v365-region-table-wrap{background:#111922}
  .dark .v363-table tbody tr,.dark .v365-region-table tbody tr{background:#18212b;border-color:#34424c;box-shadow:none}
  .dark .v363-table tbody tr:hover,.dark .v365-region-table tbody tr:hover{background:#18212b}
  .dark .v363-table td,.dark .v365-region-table td{border-color:#2b3945}
  .dark .v363-table td:nth-child(1),.dark .v365-region-table td:nth-child(1){background:#1d2732}
  .dark .v363-table td:nth-child(10),.dark .v365-region-table td:nth-child(7){background:#17312b}
  .dark .v363-product strong,.dark .v363-type strong,.dark .v363-number strong,.dark .v363-peak-cell strong,.dark .v363-cover strong,.dark .v363-suggest strong,.dark .v363-cost strong,.dark .v363-center strong,.dark .v365-region-product strong{color:#edf2f6}
  .dark .v363-method p{background:rgba(255,255,255,.035)}
}