:root{--dashboard-navy:#00437c;--dashboard-green:#087a55;--dashboard-orange:#d97706;--dashboard-red:#c52b22;--dashboard-gray:#8b95a5} .dashboard-v2{display:grid;gap:16px;min-width:0}.dashboard-cloud-stamp{font-size:12px;font-weight:800;color:#475467;background:#fff;border:1px solid #d8dee8;border-radius:999px;padding:7px 11px}.dashboard-cloud-stamp.is-ready{color:#067647;background:#ecfdf3;border-color:#a6f4c5}.dashboard-cloud-stamp.is-error{color:#b42318;background:#fef3f2;border-color:#fecdca}.dashboard-filter-card,.dashboard-data-card{background:#fff;border:1px solid #d9dde4;border-radius:15px;box-shadow:0 1px 2px rgba(16,24,40,.04)}.dashboard-filter-card{padding:14px}.dashboard-filter-head,.dashboard-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px}.dashboard-filter-head strong{font-size:15px}.dashboard-presets{display:flex;flex-wrap:wrap;gap:7px;margin-top:12px}.dashboard-preset{border:1px solid #d0d5dd;background:#fff;color:#344054;border-radius:999px;padding:7px 12px;font-size:12px;font-weight:800;cursor:pointer}.dashboard-preset:hover,.dashboard-preset.is-active{background:var(--dashboard-navy);border-color:var(--dashboard-navy);color:#fff}.dashboard-advanced-filters{display:grid;grid-template-columns:repeat(4,minmax(140px,1fr)) auto;gap:10px;align-items:end;margin-top:12px;padding-top:12px;border-top:1px solid #edf0f4}.dashboard-advanced-filters label{display:grid;gap:5px;color:#475467;font-size:11px;font-weight:800}.dashboard-advanced-filters input,.dashboard-advanced-filters select,.dashboard-card-head select{width:100%;min-width:0;border:1px solid #d0d5dd;background:#fff;border-radius:9px;padding:9px 10px;color:#101828}.dashboard-filter-head #dashboardAdvancedToggle{display:none}.dashboard-kpis{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}.dashboard-kpi{position:relative;min-width:0;border:1px solid #d9dde4;border-radius:14px;background:#fff;padding:15px;text-align:left;overflow:hidden}.dashboard-kpi.is-clickable{cursor:pointer}.dashboard-kpi.is-clickable:hover{border-color:#84a9c7;box-shadow:0 5px 18px rgba(0,67,124,.08);transform:translateY(-1px)}.dashboard-kpi-label{color:#667085;font-size:12px;font-weight:750}.dashboard-kpi-value{margin-top:8px;color:#101828;font-size:25px;line-height:1;font-weight:900;letter-spacing:-.03em}.dashboard-kpi-note{min-height:17px;margin-top:7px;color:#667085;font-size:11px}.dashboard-kpi-accent{position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--dashboard-navy)}.dashboard-kpi.is-good .dashboard-kpi-accent{background:var(--dashboard-green)}.dashboard-kpi.is-warning .dashboard-kpi-accent{background:var(--dashboard-orange)}.dashboard-kpi.is-danger .dashboard-kpi-accent{background:var(--dashboard-red)}.dashboard-kpi-progress{height:6px;background:#eef1f5;border-radius:999px;margin-top:10px;overflow:hidden}.dashboard-kpi-progress span{display:block;height:100%;background:var(--dashboard-green);border-radius:inherit}.dashboard-phase1-grid{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(320px,.85fr);gap:14px}.dashboard-data-card{padding:16px;min-width:0;overflow:hidden}.dashboard-plan-card{min-height:360px}.dashboard-card-head h2{font-size:15px;margin:0;color:#101828}.dashboard-card-head p{font-size:11px;color:#667085;margin:4px 0 0}.dashboard-card-head select{font-size:12px;padding:7px 9px}.dashboard-chart-actions{display:flex;gap:7px}.dashboard-chart-host{min-height:250px;margin-top:14px;overflow:hidden}.dashboard-empty,.dashboard-block-error{min-height:220px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px;text-align:center;color:#667085;font-size:13px}.dashboard-block-error{color:#b42318}.dashboard-skeleton{height:100%;min-height:220px;border-radius:10px;background:linear-gradient(90deg,#f2f4f7 25%,#fafbfc 38%,#f2f4f7 63%);background-size:400% 100%;animation:dashboardShimmer 1.35s ease infinite}.dashboard-kpi-skeleton{height:116px;border-radius:14px}@keyframes dashboardShimmer{0%{background-position:100% 0}100%{background-position:0 0}}.dashboard-bar-scroll{display:flex;align-items:flex-end;gap:14px;height:235px;overflow-x:auto;overflow-y:hidden;padding:14px 4px 2px}.dashboard-bar-group{display:grid;grid-template-rows:1fr auto;min-width:70px;height:100%;cursor:pointer}.dashboard-bar-pair{display:flex;align-items:flex-end;justify-content:center;gap:5px;height:100%;border-bottom:1px solid #d0d5dd}.dashboard-bar{width:23px;min-height:2px;border-radius:5px 5px 0 0}.dashboard-bar.plan{background:#a9b1bd}.dashboard-bar.actual{background:var(--dashboard-navy)}.dashboard-axis-label{font-size:10px;font-weight:800;text-align:center;color:#475467;max-width:86px;margin-top:7px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.dashboard-legend{display:flex;align-items:center;justify-content:center;gap:15px;margin-top:7px;color:#667085;font-size:11px}.dashboard-legend span:before{content:'';display:inline-block;width:9px;height:9px;border-radius:2px;margin-right:5px;background:var(--legend)}.dashboard-line-svg{width:100%;height:218px;overflow:visible}.dashboard-line-point{cursor:pointer}.dashboard-line-labels{display:flex;justify-content:space-between;color:#667085;font-size:10px;padding:0 5px}.dashboard-hbar-list{display:grid;gap:12px}.dashboard-hbar-row{cursor:pointer}.dashboard-hbar-head{display:flex;justify-content:space-between;gap:10px;margin-bottom:5px;font-size:12px}.dashboard-hbar-head strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.dashboard-hbar-track{height:14px;background:#edf1f5;border-radius:999px;overflow:hidden}.dashboard-hbar-track span{display:block;height:100%;background:var(--dashboard-navy);border-radius:inherit}.dashboard-hbar-meta{display:flex;justify-content:space-between;margin-top:4px;color:#667085;font-size:10px}.dashboard-inventory-bars{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;height:235px;align-items:end}.dashboard-inventory-item{display:grid;grid-template-rows:1fr auto;gap:8px;height:100%;cursor:pointer;text-align:center}.dashboard-inventory-column{align-self:end;min-height:3px;border-radius:7px 7px 2px 2px;background:var(--dashboard-navy)}.dashboard-inventory-item:nth-child(2) .dashboard-inventory-column{background:#d97706}.dashboard-inventory-item:nth-child(3) .dashboard-inventory-column{background:#087a55}.dashboard-inventory-label strong{display:block;font-size:12px}.dashboard-inventory-label span{display:block;color:#667085;font-size:10px;margin-top:2px}.dashboard-asof{font-size:10px;font-weight:800;color:#475467;background:#f2f4f7;border-radius:999px;padding:5px 8px}.dashboard-tooltip{position:fixed;z-index:1000;pointer-events:none;max-width:240px;padding:9px 10px;background:#101828;color:#fff;border-radius:8px;box-shadow:0 6px 22px rgba(16,24,40,.24);font-size:11px;line-height:1.55;opacity:0;transform:translate(-50%,-110%);transition:opacity .08s}.dashboard-tooltip.is-visible{opacity:1}.dashboard-legacy-compat{display:none!important} @media(max-width:1180px){.dashboard-kpis{grid-template-columns:repeat(3,minmax(0,1fr))}.dashboard-phase1-grid{grid-template-columns:1fr}.dashboard-plan-card{min-height:330px}} @media(max-width:760px){#dashboard .dashboard-top{gap:8px}.dashboard-cloud-stamp{padding:5px 8px}.dashboard-filter-head #dashboardAdvancedToggle{display:block}.dashboard-advanced-filters{display:none;grid-template-columns:1fr 1fr}.dashboard-advanced-filters.is-open{display:grid}.dashboard-advanced-filters .btn{grid-column:1/-1}.dashboard-kpis{grid-template-columns:1fr 1fr;gap:9px}.dashboard-kpi{padding:12px}.dashboard-kpi-value{font-size:21px}.dashboard-phase1-grid{gap:10px}.dashboard-data-card{padding:13px}.dashboard-card-head{align-items:stretch;flex-direction:column}.dashboard-chart-actions{width:100%}.dashboard-chart-actions select{flex:1}.dashboard-chart-host{min-height:230px}.dashboard-bar-scroll{height:218px}.dashboard-inventory-bars{height:220px;gap:8px}.dashboard-filter-card{position:relative}.dashboard-presets{overflow-x:auto;flex-wrap:nowrap;padding-bottom:3px}.dashboard-preset{white-space:nowrap}.dashboard-tooltip{max-width:210px}.dashboard-kpi-note{font-size:10px}} @media(max-width:380px){.dashboard-kpis{grid-template-columns:1fr}.dashboard-advanced-filters{grid-template-columns:1fr}.dashboard-inventory-label strong{font-size:11px}} @media(prefers-reduced-motion:reduce){.dashboard-skeleton{animation:none}.dashboard-kpi{transition:none}} .dashboard-phase2-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.dashboard-cost-trend-card{min-height:360px}.dashboard-donut-layout{display:grid;grid-template-columns:minmax(150px,.8fr) minmax(230px,1.2fr);align-items:center;gap:20px;min-height:235px}.dashboard-donut{width:172px;height:172px;border:0;border-radius:50%;margin:auto;position:relative;display:grid;place-items:center;padding:0;cursor:pointer}.dashboard-donut:after{content:'';position:absolute;inset:27px;border-radius:50%;background:#fff}.dashboard-donut>span{position:relative;z-index:1;display:grid;gap:4px;text-align:center;max-width:110px}.dashboard-donut>span b{font-size:17px;color:#101828;overflow-wrap:anywhere}.dashboard-donut>span small{font-size:10px;color:#667085}.dashboard-donut-list{display:grid;gap:6px}.dashboard-donut-row{display:grid;grid-template-columns:9px minmax(90px,1fr) auto 42px;align-items:center;gap:7px;width:100%;border:0;background:transparent;padding:6px 4px;text-align:left;color:#344054;font-size:11px}.dashboard-donut-row[onclick]{cursor:pointer}.dashboard-donut-row:hover{background:#f7f9fb;border-radius:7px}.dashboard-donut-row i{width:9px;height:9px;border-radius:3px}.dashboard-donut-row b{text-align:right;color:#101828}.dashboard-donut-row em{text-align:right;color:#667085;font-style:normal}.dashboard-data-note{margin-top:8px;padding:8px 10px;border-radius:8px;background:#fffaeb;color:#7a2e0e;font-size:10px;line-height:1.45}.dashboard-stack-scroll{height:250px;display:flex;align-items:flex-end;gap:24px;overflow-x:auto;padding:12px 10px 2px;border-bottom:1px solid #d0d5dd}.dashboard-stack-group{height:100%;min-width:80px;display:grid;grid-template-rows:1fr auto;align-items:end;justify-items:center;gap:8px}.dashboard-stack-column{width:48px;min-height:3px;display:flex;flex-direction:column-reverse;border-radius:6px 6px 0 0;overflow:hidden;background:#eef1f5}.dashboard-stack-column span{display:block;width:100%}.dashboard-stack-group>strong{font-size:10px;color:#475467}.dashboard-cost-legend{flex-wrap:wrap} @media(max-width:760px){.dashboard-phase2-grid{grid-template-columns:1fr;gap:10px}.dashboard-donut-layout{grid-template-columns:1fr;gap:12px}.dashboard-donut{width:150px;height:150px}.dashboard-donut:after{inset:24px}.dashboard-donut-row{grid-template-columns:9px minmax(80px,1fr) auto 38px}.dashboard-stack-scroll{height:225px;gap:18px}.dashboard-stack-column{width:42px}} .dashboard-material-card{min-height:360px}.dashboard-material-scroll{height:255px;display:flex;align-items:flex-end;gap:18px;overflow-x:auto;overflow-y:hidden;padding:12px 6px 2px}.dashboard-material-group{height:100%;min-width:76px;display:grid;grid-template-rows:1fr auto auto;gap:5px;border:0;background:transparent;padding:0;cursor:pointer;color:#344054}.dashboard-material-bars{display:flex;align-items:flex-end;justify-content:center;gap:5px;height:100%;border-bottom:1px solid #d0d5dd}.dashboard-material-bars span{display:block;width:24px;min-height:2px;border-radius:5px 5px 0 0}.dashboard-material-bars .standard{background:#98a2b3}.dashboard-material-bars .actual{background:#00437c}.dashboard-material-group.is-warning .actual{background:#c62828}.dashboard-material-group>strong{font-size:10px;max-width:88px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.dashboard-material-group>em{font-size:9px;color:#667085;font-style:normal}.dashboard-material-group.is-warning>em{color:#b42318;font-weight:800}.dashboard-threshold-note{font-size:10px}.dashboard-alert-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;margin-top:14px}.dashboard-alert{display:grid;grid-template-columns:32px minmax(0,1fr) auto;align-items:center;gap:10px;min-height:66px;border:1px solid #fedf89;border-radius:11px;background:#fffaeb;padding:10px 12px;text-align:left;color:#344054;cursor:pointer}.dashboard-alert.is-danger{background:#fef3f2;border-color:#fecdca}.dashboard-alert.is-unsupported{background:#f2f4f7;border-color:#d0d5dd;cursor:not-allowed;opacity:.8}.dashboard-alert-icon{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:#fff3d6;color:#b54708;font-weight:900}.dashboard-alert.is-danger .dashboard-alert-icon{background:#fee4e2;color:#b42318}.dashboard-alert.is-unsupported .dashboard-alert-icon{background:#e4e7ec;color:#667085}.dashboard-alert strong{display:block;font-size:12px}.dashboard-alert small{display:block;margin-top:3px;color:#667085;font-size:9px;line-height:1.35}.dashboard-alert>b{font-size:18px;color:#101828} @media(max-width:760px){.dashboard-material-scroll{height:225px;gap:12px}.dashboard-material-group{min-width:68px}.dashboard-material-bars span{width:21px}.dashboard-alert-list{grid-template-columns:1fr}.dashboard-alert{min-height:58px}} /* /tong-quan: fix clipping on mobile and hide cloud status badge. */ .dashboard-cloud-stamp{display:none!important} @media(max-width:760px){ html,body{width:100%!important;max-width:100%!important;overflow-x:hidden!important} .main{width:100%!important;max-width:100vw!important;min-width:0!important;overflow-x:hidden!important} #dashboard.panel,#dashboard.panel.active{width:100%!important;max-width:100vw!important;min-width:0!important;overflow-x:hidden!important;box-sizing:border-box!important} #dashboard .dashboard-top,#dashboard .dashboard-v2,#dashboard .dashboard-filter-card,#dashboard .dashboard-kpis,#dashboard .dashboard-phase1-grid,#dashboard .dashboard-phase2-grid,#dashboard .dashboard-data-card,#dashboard .dashboard-chart-host,#dashboard .dashboard-alert-list{width:100%!important;max-width:100%!important;min-width:0!important;box-sizing:border-box!important} #dashboard .dashboard-kpis{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important} #dashboard .dashboard-kpi{width:100%!important;max-width:100%!important;min-height:108px!important;padding:10px 10px 9px 13px!important;border-radius:12px!important} #dashboard .dashboard-kpi:last-child{grid-column:1/-1!important;min-height:92px!important} #dashboard .dashboard-kpi-label{font-size:10px!important;line-height:1.25!important} #dashboard .dashboard-kpi-value{font-size:20px!important;line-height:1!important;margin-top:6px!important} #dashboard .dashboard-kpi-note{font-size:9px!important;line-height:1.25!important;min-height:0!important;margin-top:6px!important} #dashboard .dashboard-kpi-progress{height:5px!important;margin-top:8px!important} #dashboard .dashboard-kpi-accent{width:3px!important} #dashboard .dashboard-phase1-grid{grid-template-columns:minmax(0,1fr)!important} #dashboard .dashboard-card-head{width:100%!important;min-width:0!important} #dashboard .dashboard-chart-actions{display:grid!important;grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;width:100%!important} #dashboard .dashboard-chart-actions select{width:100%!important;min-width:0!important} #dashboard .dashboard-presets{width:100%!important;max-width:100%!important;overflow-x:auto!important;overscroll-behavior-inline:contain} #dashboard .dashboard-bar-scroll{width:100%!important;max-width:100%!important;overflow-x:auto!important;overflow-y:hidden!important} #dashboard .dashboard-line-svg{width:100%!important;max-width:100%!important;overflow:hidden!important} #dashboard .dashboard-hbar-list,#dashboard .dashboard-hbar-row,#dashboard .dashboard-hbar-track{width:100%!important;max-width:100%!important;min-width:0!important} #dashboard .dashboard-inventory-bars{width:100%!important;max-width:100%!important;grid-template-columns:minmax(0,1fr)!important;height:auto!important;gap:12px!important} #dashboard .dashboard-inventory-item{height:150px!important;min-width:0!important} } @media(max-width:380px){ #dashboard .dashboard-chart-actions{grid-template-columns:minmax(0,1fr)!important} } :root{--saas-navy:#00437c;--saas-green:#087a55;--saas-orange:#d97706;--saas-red:#c52b22;--saas-gray:#667085} .saas-overview-dashboard{display:grid;gap:14px;min-width:0;margin-top:14px} .saas-overview-loading,.saas-overview-error{min-height:180px;display:grid;place-items:center;border:1px solid #d9dde4;border-radius:14px;background:#fff;color:#667085;text-align:center;padding:20px} .saas-overview-error{color:#b42318;gap:10px} .saas-kpi-group{display:grid;gap:9px}.saas-kpi-group>h2,.saas-section-title{margin:0;color:#101828;font-size:14px;font-weight:900;text-transform:uppercase;letter-spacing:.03em} .saas-kpi-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:9px}.saas-kpi-card{position:relative;min-width:0;overflow:hidden;border:1px solid #d9dde4;border-radius:13px;background:#fff;padding:13px;box-shadow:0 1px 2px rgba(16,24,40,.04)}.saas-kpi-card:before{content:'';position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--saas-navy)}.saas-kpi-card.good:before{background:var(--saas-green)}.saas-kpi-card.warning:before{background:var(--saas-orange)}.saas-kpi-card.danger:before{background:var(--saas-red)}.saas-kpi-label{color:#667085;font-size:11px;font-weight:800}.saas-kpi-value{margin-top:7px;color:#101828;font-size:22px;line-height:1;font-weight:900;overflow-wrap:anywhere}.saas-kpi-note{margin-top:6px;color:#667085;font-size:9px;line-height:1.35} .saas-config-warning{display:flex;align-items:flex-start;gap:9px;border:1px solid #fedf89;border-radius:11px;background:#fffaeb;color:#7a2e0e;padding:10px 12px;font-size:11px}.saas-config-warning strong{display:block;margin-bottom:2px} .saas-dashboard-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.saas-dashboard-card{min-width:0;overflow:hidden;border:1px solid #d9dde4;border-radius:14px;background:#fff;padding:15px}.saas-dashboard-card.full{grid-column:1/-1}.saas-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;margin-bottom:13px}.saas-card-head h2{margin:0;color:#101828;font-size:15px}.saas-card-head p{margin:4px 0 0;color:#667085;font-size:10px}.saas-chart-host{min-height:210px} .saas-status-list,.saas-resource-list,.saas-alert-list{display:grid;gap:9px}.saas-status-row{display:grid;grid-template-columns:minmax(100px,1fr) minmax(120px,2fr) auto;align-items:center;gap:9px;font-size:11px}.saas-status-row strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.saas-track{height:11px;overflow:hidden;border-radius:999px;background:#edf1f5}.saas-track>span{display:block;height:100%;border-radius:inherit;background:var(--saas-navy)}.saas-status-row:nth-child(2n) .saas-track>span{background:#087a55} .saas-month-bars{height:210px;display:flex;align-items:flex-end;gap:9px;overflow-x:auto;padding:10px 2px 0}.saas-month-item{height:100%;min-width:38px;flex:1;display:grid;grid-template-rows:1fr auto;gap:6px;align-items:end;text-align:center}.saas-month-column{min-height:2px;border-radius:5px 5px 1px 1px;background:var(--saas-navy)}.saas-month-column.revenue{background:var(--saas-green)}.saas-month-item small{font-size:8px;color:#667085;white-space:nowrap} .saas-alert-list{grid-template-columns:repeat(2,minmax(0,1fr))}.saas-alert{display:grid;grid-template-columns:28px minmax(0,1fr) auto;align-items:center;gap:9px;min-height:58px;border:1px solid #fedf89;border-radius:10px;background:#fffaeb;padding:9px;color:#344054}.saas-alert.danger{border-color:#fecdca;background:#fef3f2}.saas-alert.neutral{border-color:#d0d5dd;background:#f9fafb}.saas-alert-icon{width:26px;height:26px;display:grid;place-items:center;border-radius:50%;background:#fff3d6;color:#b54708;font-weight:900}.saas-alert.danger .saas-alert-icon{background:#fee4e2;color:#b42318}.saas-alert strong{display:block;font-size:11px}.saas-alert small{display:block;margin-top:2px;color:#667085;font-size:9px}.saas-alert b{font-size:17px} .saas-table-wrap{max-width:100%;overflow-x:auto}.saas-overview-table{width:100%;border-collapse:collapse;font-size:10px}.saas-overview-table th,.saas-overview-table td{padding:8px;border-bottom:1px solid #eaecf0;text-align:left;vertical-align:middle}.saas-overview-table th{color:#475467;background:#f9fafb}.saas-overview-table .btn{white-space:nowrap}.saas-mobile-list{display:none} .saas-resource{display:grid;gap:6px;border-bottom:1px solid #eaecf0;padding:8px 0}.saas-resource:last-child{border-bottom:0}.saas-resource-head,.saas-resource-meta{display:flex;justify-content:space-between;gap:10px}.saas-resource-head{font-size:11px}.saas-resource-meta{color:#667085;font-size:9px;flex-wrap:wrap}.saas-quota-missing{color:#b54708;font-weight:800}.saas-empty{min-height:160px;display:grid;place-items:center;text-align:center;color:#667085;font-size:11px} .saas-quick-actions{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}.saas-quick-action{border:1px solid #d0d5dd;border-radius:10px;background:#fff;color:#344054;padding:11px 8px;font-size:10px;font-weight:850;cursor:pointer}.saas-quick-action:hover{border-color:var(--saas-navy);color:var(--saas-navy);background:#f5f9fc} .saas-pill{display:inline-flex;align-items:center;border-radius:999px;padding:4px 7px;background:#eef5fb;color:#00437c;font-size:9px;font-weight:850}.saas-pill.warn{background:#fffaeb;color:#b54708}.saas-pill.danger{background:#fef3f2;color:#b42318} @media(max-width:1180px){.saas-kpi-grid{grid-template-columns:repeat(3,minmax(0,1fr))}} @media(max-width:760px){.saas-overview-dashboard{gap:10px}.saas-kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.saas-kpi-card{padding:11px}.saas-kpi-value{font-size:19px}.saas-dashboard-grid{grid-template-columns:1fr;gap:10px}.saas-dashboard-card.full{grid-column:auto}.saas-dashboard-card{padding:12px}.saas-alert-list{grid-template-columns:1fr}.saas-table-wrap{display:none}.saas-mobile-list{display:grid;gap:8px}.saas-mobile-card{border:1px solid #e1e5eb;border-radius:10px;padding:10px;display:grid;gap:7px}.saas-mobile-card-head{display:flex;justify-content:space-between;align-items:flex-start;gap:8px}.saas-mobile-card-meta{display:grid;grid-template-columns:1fr 1fr;gap:6px;color:#667085;font-size:9px}.saas-mobile-card .btn{width:100%}.saas-quick-actions{grid-template-columns:1fr 1fr}.saas-status-row{grid-template-columns:minmax(88px,1fr) minmax(90px,1.5fr) auto}.saas-chart-host{min-height:190px}.saas-month-bars{gap:4px;overflow:hidden}.saas-month-item{min-width:0}.saas-month-item small{font-size:7px}} @media(max-width:360px){.saas-kpi-grid{grid-template-columns:1fr}.saas-quick-actions{grid-template-columns:1fr}} .tenant360{display:grid;gap:16px}.tenant360-toolbar{display:grid;grid-template-columns:minmax(240px,2fr) repeat(4,minmax(130px,1fr)) auto;gap:10px;align-items:end}.tenant360-field{display:grid;gap:5px;font-size:12px;font-weight:750;color:#475467}.tenant360-field input,.tenant360-field select{height:40px;border:1px solid #d0d5dd;border-radius:10px;padding:0 10px;background:#fff;color:#101828}.tenant360-actions{display:flex;gap:8px;flex-wrap:wrap}.tenant360-summary{display:flex;justify-content:space-between;gap:12px;align-items:center;color:#667085;font-size:13px}.tenant360-table-wrap{overflow:auto;border:1px solid #e4e7ec;border-radius:12px}.tenant360-table{width:100%;min-width:1540px;border-collapse:collapse}.tenant360-table th{position:sticky;top:0;background:#f8fafc;color:#344054;font-size:11px;text-transform:uppercase;letter-spacing:.03em;z-index:1}.tenant360-table th,.tenant360-table td{padding:10px;border-bottom:1px solid #eaecf0;text-align:left;vertical-align:top}.tenant360-table td{font-size:12px;color:#344054}.tenant360-name{font-weight:850;color:#00437c}.tenant360-code{font:11px ui-monospace,SFMono-Regular,Consolas,monospace;color:#667085}.tenant360-badge{display:inline-flex;padding:4px 8px;border-radius:999px;font-size:11px;font-weight:800;background:#eef2f6;color:#344054}.tenant360-badge.good{background:#ecfdf3;color:#027a48}.tenant360-badge.warn{background:#fffaeb;color:#b54708}.tenant360-badge.bad{background:#fef3f2;color:#b42318}.tenant360-pager{display:flex;justify-content:flex-end;align-items:center;gap:8px}.tenant360-pager button:disabled{opacity:.45}.tenant360-empty,.tenant360-error{padding:30px;text-align:center;border:1px dashed #d0d5dd;border-radius:12px;color:#667085}.tenant360-error{color:#b42318;background:#fff7f6}.tenant360-skeleton{height:260px;border-radius:12px;background:linear-gradient(90deg,#f2f4f7 25%,#fafafa 37%,#f2f4f7 63%);background-size:400% 100%;animation:tenant360pulse 1.4s infinite}@keyframes tenant360pulse{0%{background-position:100% 0}100%{background-position:0 0}} .tenant360-detail-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}.tenant360-detail-head h2{margin:3px 0 4px}.tenant360-back{border:0;background:none;color:#00437c;font-weight:800;padding:0;cursor:pointer}.tenant360-tabs{display:flex;gap:6px;overflow:auto;padding-bottom:3px}.tenant360-tab{white-space:nowrap;border:1px solid #d0d5dd;background:#fff;border-radius:9px;padding:9px 12px;font-weight:750;color:#475467}.tenant360-tab.active{background:#00437c;color:#fff;border-color:#00437c}.tenant360-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.tenant360-kpi{border:1px solid #e4e7ec;border-radius:12px;padding:13px;background:#fff}.tenant360-kpi span{display:block;color:#667085;font-size:12px}.tenant360-kpi strong{display:block;margin-top:6px;font-size:20px;color:#101828}.tenant360-panel{border:1px solid #e4e7ec;border-radius:12px;padding:14px;background:#fff}.tenant360-panel h3{margin:0 0 12px;font-size:15px}.tenant360-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 20px}.tenant360-info{display:grid;grid-template-columns:145px 1fr;gap:8px;padding:7px 0;border-bottom:1px solid #f2f4f7;font-size:12px}.tenant360-info span{color:#667085}.tenant360-info strong{overflow-wrap:anywhere}.tenant360-cards{display:grid;gap:10px}.tenant360-card{border:1px solid #e4e7ec;border-radius:10px;padding:12px}.tenant360-card-top{display:flex;justify-content:space-between;gap:10px}.tenant360-anomaly{margin-top:8px;padding:8px;border-radius:8px;background:#fff4e5;color:#9a3412;font-weight:700;font-size:12px}.tenant360-progress{height:8px;background:#eaecf0;border-radius:99px;overflow:hidden;margin-top:8px}.tenant360-progress i{display:block;height:100%;background:#00437c}.tenant360-sensitive{border-color:#fecdca;background:#fffbfa}.tenant360-form{display:grid;grid-template-columns:repeat(4,minmax(120px,1fr));gap:10px}.tenant360-form input,.tenant360-form select{width:100%;height:38px;border:1px solid #d0d5dd;border-radius:8px;padding:0 8px}.tenant360-note{font-size:12px;color:#667085}.tenant360-money{font-weight:850;font-variant-numeric:tabular-nums}.tenant360-mobile-list{display:none} @media(max-width:1100px){.tenant360-toolbar{grid-template-columns:repeat(3,minmax(0,1fr))}.tenant360-search{grid-column:span 2}.tenant360-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.tenant360-form{grid-template-columns:repeat(2,minmax(0,1fr))}} @media(max-width:700px){.tenant360-toolbar{grid-template-columns:1fr 1fr}.tenant360-search{grid-column:1/-1}.tenant360-actions{grid-column:1/-1}.tenant360-summary{align-items:flex-start;flex-direction:column}.tenant360-table-wrap{display:none}.tenant360-mobile-list{display:grid;gap:10px}.tenant360-mobile-card{border:1px solid #dfe3ea;border-radius:12px;padding:12px;background:#fff;display:grid;gap:8px}.tenant360-mobile-card .tenant360-info{grid-template-columns:110px 1fr}.tenant360-detail-head{flex-direction:column}.tenant360-kpis{grid-template-columns:1fr 1fr}.tenant360-grid{grid-template-columns:1fr}.tenant360-form{grid-template-columns:1fr}.tenant360-panel{padding:11px}.tenant360-tab{padding:8px 10px;font-size:12px}} @media(max-width:380px){.tenant360-toolbar,.tenant360-kpis{grid-template-columns:1fr}.tenant360-search{grid-column:auto}.tenant360-actions{grid-column:auto}.tenant360-info{grid-template-columns:1fr}} .saas-users-global{display:grid;gap:16px}.saas-users-toolbar{display:grid;grid-template-columns:minmax(230px,2fr) repeat(4,minmax(125px,1fr));gap:9px}.saas-users-toolbar .wide{grid-column:span 2}.saas-users-filter-actions{display:flex;gap:8px;align-items:end;flex-wrap:wrap}.saas-users-field{display:grid;gap:5px;color:#475467;font-size:12px;font-weight:750}.saas-users-field input,.saas-users-field select{height:39px;border:1px solid #d0d5dd;border-radius:9px;padding:0 9px;background:#fff;color:#101828}.saas-users-summary{display:flex;justify-content:space-between;align-items:center;gap:10px;color:#667085;font-size:13px}.saas-users-table-wrap{overflow:auto;border:1px solid #e4e7ec;border-radius:12px}.saas-users-table{width:100%;min-width:1580px;border-collapse:collapse}.saas-users-table th{position:sticky;top:0;z-index:1;background:#f8fafc;font-size:11px;text-transform:uppercase;color:#475467}.saas-users-table th,.saas-users-table td{padding:10px;border-bottom:1px solid #eaecf0;text-align:left;vertical-align:top}.saas-users-table td{font-size:12px}.saas-user-name{font-weight:850;color:#00437c}.saas-user-id{font:11px ui-monospace,SFMono-Regular,Consolas,monospace;color:#667085;overflow-wrap:anywhere}.saas-user-badge{display:inline-flex;padding:4px 8px;border-radius:999px;background:#f2f4f7;color:#475467;font-size:11px;font-weight:800}.saas-user-badge.good{background:#ecfdf3;color:#027a48}.saas-user-badge.warn{background:#fffaeb;color:#b54708}.saas-user-badge.bad{background:#fef3f2;color:#b42318}.saas-users-mobile{display:none}.saas-user-mobile-card{display:grid;gap:8px;border:1px solid #e4e7ec;border-radius:12px;padding:12px;background:#fff}.saas-user-card-head{display:flex;justify-content:space-between;align-items:flex-start;gap:8px}.saas-user-info{display:grid;grid-template-columns:145px 1fr;gap:8px;padding:7px 0;border-bottom:1px solid #f2f4f7;font-size:12px}.saas-user-info span{color:#667085}.saas-user-info strong{overflow-wrap:anywhere}.saas-user-pager{display:flex;justify-content:flex-end;align-items:center;gap:8px}.saas-user-pager button:disabled{opacity:.45}.saas-user-empty,.saas-user-error{padding:30px;text-align:center;border:1px dashed #d0d5dd;border-radius:12px;color:#667085}.saas-user-error{background:#fff7f6;color:#b42318}.saas-user-skeleton{height:260px;border-radius:12px;background:linear-gradient(90deg,#f2f4f7 25%,#fafafa 37%,#f2f4f7 63%);background-size:400% 100%;animation:saasUserPulse 1.4s infinite}@keyframes saasUserPulse{0%{background-position:100% 0}100%{background-position:0 0}} .saas-user-detail-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}.saas-user-detail-head h2{margin:4px 0}.saas-user-back{border:0;background:none;color:#00437c;font-weight:850;padding:0;cursor:pointer}.saas-user-tabs{display:flex;gap:6px;overflow:auto;padding-bottom:3px}.saas-user-tab{white-space:nowrap;border:1px solid #d0d5dd;background:#fff;border-radius:9px;padding:9px 12px;color:#475467;font-weight:750}.saas-user-tab.active{background:#00437c;color:#fff;border-color:#00437c}.saas-user-panel{border:1px solid #e4e7ec;border-radius:12px;padding:14px;background:#fff}.saas-user-panel h3{margin:0 0 12px;font-size:15px}.saas-user-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.saas-user-warning{border:1px solid #fedf89;background:#fffaeb;color:#7a2e0e;border-radius:10px;padding:12px;font-size:12px}.saas-user-danger-note{border:1px solid #fecdca;background:#fff7f6;color:#912018;border-radius:10px;padding:12px;font-size:12px}.saas-user-cards{display:grid;gap:10px}.saas-user-card{border:1px solid #e4e7ec;border-radius:10px;padding:12px}.saas-user-permission-block{margin-top:10px}.saas-user-permission-block summary{cursor:pointer;font-weight:750;color:#00437c}.saas-user-chip-list{display:flex;flex-wrap:wrap;gap:5px;margin-top:8px}.saas-user-chip{font-size:10px;padding:3px 6px;border-radius:6px;background:#f2f4f7;color:#344054}.saas-user-json{max-height:240px;overflow:auto;background:#101828;color:#d0d5dd;padding:10px;border-radius:8px;font:11px ui-monospace,SFMono-Regular,Consolas,monospace;white-space:pre-wrap;overflow-wrap:anywhere}.saas-user-readonly-actions{display:grid;gap:8px}.saas-user-readonly-action{border:1px solid #e4e7ec;border-radius:9px;padding:10px;display:flex;justify-content:space-between;gap:10px;align-items:center}.saas-user-readonly-action button{opacity:.5;cursor:not-allowed}.saas-user-audit-head{display:flex;justify-content:space-between;gap:10px}.saas-user-audit-data{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:8px}.saas-user-audit-data details{min-width:0} @media(max-width:1100px){.saas-users-toolbar{grid-template-columns:repeat(3,minmax(0,1fr))}.saas-users-toolbar .wide{grid-column:span 2}} @media(max-width:700px){.saas-users-toolbar{grid-template-columns:1fr 1fr}.saas-users-toolbar .wide{grid-column:1/-1}.saas-users-summary,.saas-user-detail-head{align-items:flex-start;flex-direction:column}.saas-users-table-wrap{display:none}.saas-users-mobile{display:grid;gap:10px}.saas-user-grid{grid-template-columns:1fr}.saas-user-panel{padding:11px}.saas-user-info{grid-template-columns:115px 1fr}.saas-user-audit-data{grid-template-columns:1fr}.saas-user-tab{font-size:12px;padding:8px 10px}} @media(max-width:380px){.saas-users-toolbar{grid-template-columns:1fr}.saas-users-toolbar .wide{grid-column:auto}.saas-user-info{grid-template-columns:1fr}} :root{--bg:#f4f4f1;--card:#fff;--text:#171717;--muted:#6b6b66;--line:#deded7;--accent:#151515;--danger:#b42318;--ok:#067647;--warn:#b54708;--info:#175cd3} *{box-sizing:border-box}body{margin:0;font-family:Inter,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;background:var(--bg);color:var(--text)}button,input,select,textarea{font:inherit}.app{display:grid;grid-template-columns:245px 1fr;min-height:100vh}.sidebar{background:#121212;color:#fff;padding:24px 16px;position:sticky;top:0;height:100vh}.brand{font-weight:900;letter-spacing:.08em;font-size:19px;margin:2px 8px 4px}.brand-sub{font-size:11px;color:#999;margin:0 8px 22px}.nav button{width:100%;text-align:left;border:0;background:transparent;color:#cfcfcf;padding:12px 10px;border-radius:9px;cursor:pointer;font-size:14px;margin-bottom:3px}.nav button.active,.nav button:hover{background:#262626;color:#fff}.nav-parent{margin:16px 8px 7px;padding-top:10px;border-top:1px solid #292929;color:#fff;font-size:11px;font-weight:900;letter-spacing:.08em}.nav-parent-system{margin-top:18px}.nav-children{padding-left:8px}.nav-children button{position:relative;padding-left:20px;font-size:13px}.nav-children button:before{content:'›';position:absolute;left:8px;color:#666}.nav-children button.active:before,.nav-children button:hover:before{color:#fff}.sidebar-bottom{position:absolute;bottom:18px;left:16px;right:16px;font-size:11px;color:#777}.main{padding:28px;min-width:0}.top{display:flex;justify-content:space-between;gap:16px;align-items:center;margin-bottom:20px}.top h1{font-size:26px;margin:0}.small{font-size:12px;color:var(--muted)}.btn{border:0;border-radius:8px;padding:9px 13px;cursor:pointer;font-weight:700;font-size:13px}.btn.primary{background:#111;color:#fff}.btn.ghost{background:#fff;border:1px solid var(--line);color:#222}.btn.danger{background:#fff;border:1px solid #f3b5b0;color:var(--danger)}.btn.smallbtn{padding:6px 9px;font-size:12px}.grid{display:grid;gap:14px}.stats{grid-template-columns:repeat(4,minmax(0,1fr));margin-bottom:18px}.card{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:16px}.stat .label{font-size:12px;color:var(--muted)}.stat .value{font-size:23px;font-weight:850;margin-top:7px;letter-spacing:-.02em}.panel{display:none}.panel.active{display:block}.toolbar{display:flex;gap:10px;justify-content:space-between;align-items:center;margin-bottom:12px;flex-wrap:wrap}.toolbar .left,.toolbar .right{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.toolbar input,.toolbar select{padding:9px 10px;border:1px solid var(--line);border-radius:8px;background:#fff;min-width:180px}table{width:100%;border-collapse:collapse;font-size:13px}th,td{padding:10px;border-bottom:1px solid #ecece7;text-align:left;vertical-align:top}th{color:#5d5d5d;font-weight:750;background:#fafafa;white-space:nowrap}.money{text-align:right;white-space:nowrap}.nowrap{white-space:nowrap}.badge{display:inline-block;padding:4px 8px;border-radius:999px;font-size:11px;font-weight:800;white-space:nowrap}.badge.ok{background:#ecfdf3;color:var(--ok)}.badge.warn{background:#fffaeb;color:var(--warn)}.badge.danger{background:#fef3f2;color:var(--danger)}.badge.info{background:#eff8ff;color:var(--info)}.badge.gray{background:#f2f4f7;color:#475467}.progress{height:7px;background:#eee;border-radius:99px;overflow:hidden;margin-top:7px}.progress>span{display:block;height:100%;background:#222;border-radius:99px}.modal{position:fixed;inset:0;background:rgba(0,0,0,.46);display:none;align-items:center;justify-content:center;padding:18px;z-index:20}.modal.open{display:flex}.dialog{background:#fff;width:min(1180px,97vw);max-height:94vh;overflow:auto;border-radius:14px;padding:20px}.dialog.medium{width:min(760px,95vw)}.dialog-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;margin-bottom:16px}.dialog-head h2{margin:0;font-size:21px}.form-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.field{display:flex;flex-direction:column;gap:6px}.field label{font-size:12px;color:#555;font-weight:650}.field input,.field select,.field textarea{padding:9px 10px;border:1px solid var(--line);border-radius:8px;background:#fff}.field textarea{min-height:72px;resize:vertical}.span2{grid-column:span 2}.span4{grid-column:span 4}.section-title{font-weight:850;margin:20px 0 10px;display:flex;justify-content:space-between;align-items:center;gap:10px}.item-card{border:1px solid var(--line);border-radius:12px;padding:14px;margin-bottom:12px;background:#fcfcfb}.item-head{display:flex;justify-content:space-between;gap:10px;align-items:center;margin-bottom:10px}.item-head strong{font-size:14px}.rolls-grid{display:grid;grid-template-columns:repeat(10,minmax(72px,1fr));gap:8px;margin-top:8px;overflow-x:auto;padding-bottom:4px}.roll-chip{position:relative;min-width:72px}.roll-chip label{display:block;font-size:11px;font-weight:800;color:var(--muted);margin-bottom:4px;text-align:center}.roll-chip input{width:100%;padding:8px 24px 8px 7px;border:1px solid var(--line);border-radius:7px;text-align:center}.roll-chip button{position:absolute;right:3px;bottom:4px;width:20px;height:26px;border:0;background:transparent;color:#999;cursor:pointer;font-size:15px;line-height:1}.roll-chip button:hover{color:var(--danger)}.summary-box{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin-top:14px}.summary-box .card{padding:12px}.summary-box .value{font-weight:850;font-size:17px;margin-top:4px}.actions{display:flex;justify-content:flex-end;gap:10px;margin-top:18px}.empty{padding:32px;text-align:center;color:var(--muted)}.detail-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:14px}.kv{display:grid;grid-template-columns:150px 1fr;gap:8px;font-size:13px;padding:6px 0;border-bottom:1px dashed #eee}.kv span:first-child{color:var(--muted)}.right{text-align:right}.danger-text{color:var(--danger);font-weight:800}.ok-text{color:var(--ok);font-weight:800}.muted-box{background:#fafafa;border:1px solid var(--line);border-radius:10px;padding:12px}.tabs{display:flex;gap:8px;margin:12px 0}.tabs button{border:1px solid var(--line);background:#fff;padding:7px 10px;border-radius:7px;cursor:pointer}.tabs button.active{background:#111;color:#fff;border-color:#111}.note{padding:10px 12px;background:#fffaeb;border:1px solid #fedf89;border-radius:9px;color:#7a2e0e;font-size:12px;margin-bottom:12px} @media(max-width:1050px){.stats{grid-template-columns:1fr 1fr}.form-grid{grid-template-columns:1fr 1fr}.span4{grid-column:span 2}.rolls-grid{grid-template-columns:repeat(3,1fr)}.summary-box{grid-template-columns:1fr 1fr 1fr}.detail-grid{grid-template-columns:1fr}} @media(max-width:760px){.app{grid-template-columns:1fr}.sidebar{display:none}.main{padding:14px}.top{align-items:flex-start;flex-direction:column}.stats,.form-grid,.summary-box{grid-template-columns:1fr}.span2,.span4{grid-column:span 1}.rolls-grid{grid-template-columns:1fr 1fr}.toolbar .left,.toolbar .right{width:100%}.toolbar input,.toolbar select{flex:1;min-width:140px}} .login-overlay{position:fixed;inset:0;background:#111;z-index:100;display:flex;align-items:center;justify-content:center;padding:18px}.login-box{width:min(440px,95vw);background:#fff;border-radius:18px;padding:28px}.login-box h1{margin:0 0 6px;font-size:25px}.login-box .field{margin-top:14px}.login-box .btn{width:100%;margin-top:18px;padding:12px}.user-pill{display:flex;align-items:center;gap:8px;background:#fff;border:1px solid var(--line);border-radius:999px;padding:7px 10px;font-size:12px}.role-note{font-size:11px;color:var(--muted);margin-top:8px}.inventory-metric{display:flex;justify-content:space-between;gap:12px;padding:8px 0;border-bottom:1px dashed #eee}.stock-low{color:var(--danger);font-weight:800}.stock-ok{color:var(--ok);font-weight:800}.doc-list{display:grid;gap:8px}.doc-item{display:flex;justify-content:space-between;gap:12px;align-items:center;border:1px solid var(--line);border-radius:9px;padding:9px 10px}.login-hidden{display:none!important} .inventory-matrix-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:10px;background:#fff} .inventory-matrix{border-collapse:collapse;width:max-content;min-width:100%;table-layout:fixed} .inventory-matrix th,.inventory-matrix td{border:1px solid #aeb5bd;padding:9px 10px;text-align:center;white-space:nowrap} .inventory-matrix thead th{background:#111;color:#fff;font-weight:800} .inventory-matrix .fabric-name{min-width:190px;white-space:normal;font-weight:800} .inventory-matrix .total-col{min-width:100px;font-weight:800} .inventory-matrix .roll-col{min-width:82px} .inventory-matrix .roll-meter{font-weight:700;color:var(--text);cursor:pointer}.inventory-matrix .roll-meter:hover{background:#f1f1ef;text-decoration:underline} .inventory-matrix .roll-empty{color:#999} .inventory-color-block{margin-bottom:18px} .inventory-color-block:last-child{margin-bottom:0} @media(max-width:1100px){.rolls-grid{grid-template-columns:repeat(10,minmax(76px,76px))}} .order-status-select{min-width:150px;padding:6px 8px;border:1px solid var(--line);border-radius:7px;background:#fff;font-size:12px;font-weight:700} .order-status-select:focus{outline:2px solid rgba(47,166,83,.18);border-color:#2fa653} #inventory .card{padding:10px} #inventory .toolbar{margin-bottom:8px} #inventoryTable table{font-size:12px} #inventoryTable th,#inventoryTable td{padding:7px 8px} #inventoryTable .small{font-size:10px} #inventoryStats{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px} #inventoryStats .card{padding:10px} #inventoryStats .value{font-size:16px} .inventory-color-block{margin-bottom:10px} .inventory-matrix th,.inventory-matrix td{padding:6px 7px;font-size:12px} .inventory-matrix .fabric-name{min-width:145px;max-width:180px} .inventory-matrix .total-col{min-width:78px} .inventory-matrix .roll-col{min-width:58px} .inventory-detail-fit{display:grid;gap:8px} @media(min-width:1200px){ #inventoryTable table{table-layout:fixed;width:100%} #inventoryTable th:nth-child(1){width:22%} #inventoryTable th:nth-child(2){width:14%} #inventoryTable th:nth-child(3){width:7%} #inventoryTable th:nth-child(4){width:7%} #inventoryTable th:nth-child(5), #inventoryTable th:nth-child(6), #inventoryTable th:nth-child(7){width:10%} #inventoryTable th:nth-child(8){width:10%} #inventoryTable th:nth-child(9){width:10%} } #inventoryDetailModal .dialog{width:min(96vw,1500px);max-width:1500px} .fabric-color-list{display:grid;gap:10px;margin-top:8px} .fabric-color-card{border:1px solid #deded8;border-radius:10px;padding:10px;background:#fff} .fabric-color-head{display:flex;align-items:end;justify-content:space-between;gap:10px;margin-bottom:6px} .fabric-color-head .field{min-width:220px;max-width:340px;flex:1} .fabric-costs{display:grid;grid-template-columns:repeat(5,minmax(120px,1fr));gap:8px;margin-top:12px;padding-top:12px;border-top:1px dashed #ddd} .fabric-costs .field input{text-align:right} .fabric-item-total{margin-top:10px;padding:9px 10px;border-radius:8px;background:#f5f5f3;font-size:12px;font-weight:700} @media(max-width:1050px){.fabric-costs{grid-template-columns:repeat(2,1fr)}} @media(max-width:760px){.fabric-costs{grid-template-columns:1fr}.fabric-color-head{align-items:stretch;flex-direction:column}.fabric-color-head .field{max-width:none}} .issue-roll-table input[type=checkbox]{width:18px;height:18px;cursor:pointer} .issue-roll-table tr.selected{background:#f3f3f1} .issue-roll-table tr.disabled-row{opacity:.38} .issue-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:12px 0} .issue-summary .card{padding:10px} .issue-summary .value{font-size:17px;font-weight:850;margin-top:3px} .issue-product-select{min-width:260px} .order-status-select.status-shipping{background:#e8f2ff;color:#1261a8;border-color:#9fc8ef} .order-status-select.status-stocked{background:#eaf7ee;color:#237a3b;border-color:#a9d7b5} .history-action{font-weight:800} .history-module{display:inline-block;padding:3px 7px;border-radius:999px;background:#f1f1ef;font-size:11px;font-weight:750} .history-time{white-space:nowrap;font-variant-numeric:tabular-nums} .history-detail{max-width:520px;white-space:normal} #inventoryDetailModal{z-index:120} #rollDetailModal{z-index:140} #rollDetailModal .dialog{position:relative} .issue-matrix-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:10px;background:#fff} .issue-matrix{border-collapse:collapse;width:max-content;min-width:100%} .issue-matrix th,.issue-matrix td{border:1px solid #b6bbc1;padding:8px 9px;text-align:center;white-space:nowrap} .issue-matrix thead th{background:#111;color:#fff;font-weight:800} .issue-matrix .issue-color-name{min-width:150px;font-weight:800;text-align:left} .issue-matrix .issue-total{min-width:88px;font-weight:800} .issue-roll-cell{min-width:76px;cursor:pointer;user-select:none;transition:.12s ease} .issue-roll-cell:hover{background:#f2f2f0} .issue-roll-cell.selected{font-weight:900;background:#e9e9e6;box-shadow:inset 0 0 0 2px #111;color:#111} .issue-roll-cell.disabled-cell{opacity:.28;cursor:not-allowed;background:#fafafa} .issue-roll-cell input.issue-roll-check{position:absolute;opacity:0;pointer-events:none;width:1px;height:1px} .issue-roll-cell .roll-num{display:block;font-size:10px;color:#777;margin-bottom:2px} .issue-roll-cell.selected .roll-num{color:#111;font-weight:900} .production-status-select{min-width:145px;padding:6px 8px;border:1px solid var(--line);border-radius:7px;font-size:12px;font-weight:800;background:#fff} .production-status-select.status-running{background:#eef5ff;color:#245f9a;border-color:#b8d0ea} .production-status-select.status-partial{background:#fff4df;color:#9a5a00;border-color:#efc66f} .production-status-select.status-done{background:#eaf7ee;color:#237a3b;border-color:#a9d7b5} .production-factory-tabs{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:12px;padding-bottom:10px;border-bottom:1px solid var(--line)} .production-factory-tab{border:1px solid var(--line);background:#fff;color:var(--text);border-radius:999px;padding:7px 12px;font-size:12px;font-weight:800;cursor:pointer} .production-factory-tab:hover{background:#f5f5f3} .production-factory-tab.active{background:#111;color:#fff;border-color:#111} .production-factory-tab .count{display:inline-block;margin-left:5px;opacity:.7;font-weight:700} .report-color-lines{display:grid;gap:3px;font-size:11px} .report-color-lines span{display:block;white-space:nowrap} .incoming-box{margin-top:16px;border-top:2px solid #111;padding-top:14px} .incoming-box h3{margin:0 0 8px;font-size:15px} .inventory-matrix.unified-inventory{table-layout:fixed} .inventory-matrix.unified-inventory .fabric-name{width:220px;min-width:220px;max-width:220px} .inventory-matrix.unified-inventory .total-col{width:105px;min-width:105px;max-width:105px} .inventory-matrix.unified-inventory .roll-col{width:76px;min-width:76px;max-width:76px} .inventory-matrix.unified-inventory th:nth-child(1), .inventory-matrix.unified-inventory td:nth-child(1){position:sticky;left:0;z-index:3} .inventory-matrix.unified-inventory th:nth-child(2), .inventory-matrix.unified-inventory td:nth-child(2){position:sticky;left:220px;z-index:3} .inventory-matrix.unified-inventory th:nth-child(3), .inventory-matrix.unified-inventory td:nth-child(3){position:sticky;left:325px;z-index:3} .inventory-matrix.unified-inventory thead th:nth-child(-n+3){z-index:5;background:#111} .inventory-matrix.unified-inventory tbody td:nth-child(-n+3){background:#fff} .inventory-matrix.unified-inventory tbody tr:hover td:nth-child(-n+3){background:#fafafa} .production-summary-row{cursor:pointer} .production-summary-row:hover{background:#fafafa} .production-summary-detail-grid{display:grid;gap:14px} .production-summary-detail-grid .card{padding:12px} .production-summary-size-table th,.production-summary-size-table td{text-align:center} .production-summary-size-table th:first-child,.production-summary-size-table td:first-child{text-align:left} .inventory-matrix .roll-ordinal{display:block;font-size:9px;color:#888;font-weight:700;margin-bottom:2px} .inventory-matrix thead .roll-col{font-size:11px} .inventory-continuation-row td{border-top-style:dashed} .inventory-continuation-row .fabric-name{font-weight:600;color:#777} .sortable-table thead th{cursor:pointer;user-select:none;position:relative;padding-right:20px} .sortable-table thead th:hover{background:#f0f0ed} .sortable-table thead th::after{content:'↕';position:absolute;right:6px;top:50%;transform:translateY(-50%);font-size:10px;opacity:.28} .sortable-table thead th.sort-asc::after{content:'▲';opacity:.8} .sortable-table thead th.sort-desc::after{content:'▼';opacity:.8} .production-running-note{margin-bottom:12px;padding:9px 11px;background:#f5f5f3;border-radius:8px;font-size:12px} .production-running-block{margin-bottom:16px;overflow:auto} .production-running-block.overall{margin-bottom:22px;padding-bottom:16px;border-bottom:2px solid #111} .production-running-matrix{border-collapse:collapse;width:max-content;min-width:520px;background:#fff} .production-running-matrix th,.production-running-matrix td{border:1px solid #111;padding:7px 14px;text-align:center;min-width:82px} .production-running-matrix .row-label{background:#111;color:#fff;font-weight:900;min-width:120px} .production-running-matrix .color-title{background:#111;color:#fff;font-weight:900;font-size:14px} .production-running-matrix td{font-size:14px} .production-running-matrix .grand-total{font-size:15px;background:#fafafa} .inventory-matrix .merged-color-cell{vertical-align:middle!important;text-align:center!important} .inventory-matrix .merged-color-cell.fabric-name{font-weight:850} .inventory-matrix .merged-color-cell.total-col{font-weight:850} #productionSummaryDetailModal .dialog{width:min(95vw,1350px);max-width:1350px} .production-color-summary-card{margin:0 0 20px;overflow:auto;border-radius:12px} .production-color-summary-table{border-collapse:separate;border-spacing:0;width:100%;min-width:620px;background:#fff;border:1px solid #bcc3cb;border-radius:12px;overflow:hidden} .production-color-summary-table th,.production-color-summary-table td{border-right:1px solid #c5cbd2;border-bottom:1px solid #c5cbd2;text-align:center;padding:18px 14px} .production-color-summary-table tr:last-child th,.production-color-summary-table tr:last-child td{border-bottom:0} .production-color-summary-table th:last-child,.production-color-summary-table td:last-child{border-right:0} .production-color-summary-table .prod-label-cell{width:190px;min-width:190px;background:#101b2b;color:#fff;font-size:17px;font-weight:900} .production-color-summary-table .prod-color-head{background:#101b2b;color:#fff;font-size:18px;font-weight:900;border-bottom:4px solid #f2b134} .production-color-summary-table .prod-size-head{background:#fff;color:#101b2b;font-size:17px;font-weight:800} .production-color-summary-table .prod-running-value{font-size:18px;color:#101b2b;font-weight:500} .production-color-summary-table .prod-total-value{font-size:20px;color:#101b2b;font-weight:800;background:#fff} .issue-product-block{border:1px solid var(--line);border-radius:12px;margin-bottom:14px;overflow:hidden;background:#fff} .issue-product-block-head{display:flex;justify-content:space-between;gap:10px;align-items:center;padding:10px 12px;background:#f5f5f3;border-bottom:1px solid var(--line)} .issue-product-block .issue-matrix-wrap{border:0;border-radius:0} .order-data-row{cursor:pointer} .order-data-row:hover{background:#fafafa} .order-arrival-block{margin-bottom:16px} .order-arrival-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:0 0 7px} .order-arrival-table .order-arrival-roll{font-weight:750} #detailModal .dialog{width:min(96vw,1500px);max-width:1500px} .unified-roll-table .merged-color-cell,.order-arrival-table .merged-color-cell,.inventory-matrix .merged-color-cell{vertical-align:middle!important;text-align:center!important;font-weight:850} .unified-roll-table .issue-color-name{min-width:220px} .unified-roll-table .issue-total{min-width:105px} .unified-roll-table .issue-roll-cell{min-width:76px} .issue-dialog-wide{width:min(98vw,1800px)!important;max-width:1800px!important} .issue-dialog-wide #issueRollPicker{width:100%} .issue-dialog-wide .issue-matrix-wrap{overflow-x:visible!important;width:100%} .issue-dialog-wide .issue-matrix{width:100%;table-layout:fixed} .issue-dialog-wide .issue-matrix th,.issue-dialog-wide .issue-matrix td{padding:8px 5px} .issue-dialog-wide .issue-matrix .issue-color-name{width:210px;min-width:210px} .issue-dialog-wide .issue-matrix .issue-total{width:90px;min-width:90px} .issue-dialog-wide .issue-matrix .issue-roll-cell{width:auto;min-width:58px} .issue-dialog-wide .issue-roll-cell .roll-num{font-size:9px} .issue-dialog-wide .issue-roll-cell strong{font-size:12px;white-space:nowrap} @media(max-width:1200px){ .issue-dialog-wide{width:99vw!important} .issue-dialog-wide .issue-matrix .issue-color-name{width:160px;min-width:160px} .issue-dialog-wide .issue-matrix .issue-total{width:72px;min-width:72px} .issue-dialog-wide .issue-matrix th,.issue-dialog-wide .issue-matrix td{padding:6px 3px;font-size:11px} } .issue-item-production-line{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:6px 0;border-bottom:1px dashed var(--line)} .issue-item-production-line:last-child{border-bottom:0} .issue-item-production-line .btn{flex:0 0 auto} .issue-dialog-wide .issue-matrix{table-layout:fixed!important} .issue-dialog-wide .issue-matrix .issue-color-name{ width:220px!important;min-width:220px!important;max-width:220px!important; white-space:normal!important;overflow-wrap:anywhere!important;word-break:break-word!important; line-height:1.25!important;vertical-align:middle!important; } .issue-dialog-wide .issue-matrix .issue-total{ width:92px!important;min-width:92px!important;max-width:92px!important; white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important; text-align:center!important;vertical-align:middle!important; } .issue-dialog-wide .issue-matrix .issue-roll-cell{ min-width:0!important;width:auto!important;max-width:none!important; overflow:hidden!important; } .issue-dialog-wide .issue-matrix th,.issue-dialog-wide .issue-matrix td{ box-sizing:border-box!important; } .issue-dialog-wide .issue-matrix td.issue-color-name, .issue-dialog-wide .issue-matrix th.issue-color-name{ padding-left:10px!important;padding-right:10px!important; } .accessory-order-item,.accessory-issue-item{margin-bottom:10px} #accessoryInventoryTable .stock-ok{font-weight:900} .issue-data-row{cursor:pointer} .issue-data-row:hover{background:#fafafa} #issueDetailModal .dialog{width:min(98vw,1700px);max-width:1700px} #issueDetailModal .inventory-matrix-wrap{max-width:100%;overflow:auto} .accessory-color-list,.accessory-conversion-list{display:flex;flex-direction:column;gap:8px} .accessory-color-row{display:grid;grid-template-columns:1fr auto;gap:8px;align-items:center} .accessory-conversion-row{display:grid;grid-template-columns:32px 1.1fr 32px 1fr .8fr auto;gap:8px;align-items:center} .accessory-conversion-row input{width:100%} .conversion-eq{text-align:center;font-weight:900} .conversion-base-unit{font-weight:800;padding:10px 8px;background:#f5f5f3;border:1px solid var(--line);border-radius:8px;text-align:center} @media(max-width:800px){.accessory-conversion-row{grid-template-columns:28px 1fr 28px 1fr}.accessory-conversion-row .conversion-base-unit{grid-column:2/4}.accessory-conversion-row .btn{grid-column:4}} #accessoryOrderModal .accessory-import-costs{padding-top:10px;border-top:1px dashed var(--line)} #accessoryOrderModal .accessory-item-total{font-weight:500} #accessoryOrderModal .ao-purchase-unit{font-weight:700} #accessoryOrderModal .ao-base-preview{margin-top:4px;font-weight:650} .accessory-order-data-row{cursor:pointer} .accessory-order-data-row:hover{background:#fafafa} #accessoryOrderDetailModal .dialog{width:min(96vw,1500px);max-width:1500px} .accessory-colors-title{margin:14px 0 8px!important} .accessory-order-colors{display:grid;gap:8px} .accessory-order-color-row{display:grid;grid-template-columns:minmax(180px,1fr) minmax(160px,.7fr) auto;gap:8px;align-items:end;padding:9px;border:1px solid var(--line);border-radius:9px;background:#fafafa} .accessory-order-color-row .accessory-color-remove{margin-bottom:1px} @media(max-width:760px){.accessory-order-color-row{grid-template-columns:1fr}.accessory-order-color-row .accessory-color-remove{justify-self:start}} .accessory-inventory-row{cursor:pointer} .accessory-inventory-row:hover{background:#fafafa} #accessoryInventoryDetailModal .dialog{width:min(92vw,900px);max-width:900px} .factory-select-row{display:flex;gap:8px;align-items:center} .factory-select-row select{flex:1;min-width:0} .factory-select-row .btn{flex:0 0 auto;white-space:nowrap} .production-accessory-consumption-row{display:grid;grid-template-columns:2fr 1.2fr 1fr 1fr auto;gap:8px;align-items:end;margin-bottom:8px;padding:9px;border:1px solid var(--line);border-radius:9px;background:#fafafa} @media(max-width:800px){.production-accessory-consumption-row{grid-template-columns:1fr}.production-accessory-consumption-row .btn{justify-self:start}} .finished-product-material-row{display:grid;grid-template-columns:2fr 1.2fr 1fr .8fr auto;gap:8px;align-items:end;margin-bottom:8px;padding:9px;border:1px solid var(--line);border-radius:9px;background:#fafafa} .production-material-plan{display:grid;grid-template-columns:repeat(3,minmax(170px,1fr));gap:8px;margin-bottom:12px} @media(max-width:800px){.finished-product-material-row,.production-material-plan{grid-template-columns:1fr}} .finished-product-material-row + .finished-product-material-row{margin-top:4px} .finished-product-material-row .fpm-classification{font-weight:700} .production-data-row{cursor:pointer} .production-data-row:hover{background:#fafafa} .production-data-row button,.production-data-row select{cursor:pointer} .factory-accessory-row{cursor:pointer} .factory-accessory-row:hover{background:#fafafa} .factory-accessory-detail-block{margin-bottom:18px} #factoryAccessoryDetailModal .dialog{width:min(96vw,1200px);max-width:1200px} .accessory-consumption-updated{background:#eaf7ee!important;color:#237a3b!important;border:1px solid #a9d7b5!important} .accessory-consumption-pending{background:#f3f4f6!important;color:#667085!important;border:1px solid #d0d5dd!important} #factoryAccessoryDetailModal{padding:12px} #factoryAccessoryDetailModal .dialog{ width:min(98vw,1580px); max-width:1580px; padding:26px 30px 28px; border-radius:18px; } #factoryAccessoryDetailModal .dialog-head{margin-bottom:28px} #factoryAccessoryDetailModal .dialog-head h2{font-size:27px;font-weight:900;letter-spacing:-.02em} #factoryAccessoryDetailModal .dialog-head .small{font-size:15px;margin-top:5px} .factory-accessory-history-actions{display:flex;justify-content:flex-end;margin-top:16px} .factory-accessory-history{margin-top:14px;border-top:1px solid var(--line);padding-top:14px} .factory-accessory-history[hidden]{display:none} .factory-accessory-history h3{margin:0 0 10px;font-size:17px} .factory-accessory-history-table{overflow:auto;border:1px solid var(--line);border-radius:12px} .factory-accessory-history-table table{min-width:920px;margin:0} .factory-accessory-history-in{color:#087a3e;font-weight:800} .factory-accessory-history-out{color:#c03535;font-weight:800} .factory-accessory-detail-table-wrap{ border:1px solid #d8dadd; border-radius:8px; overflow:hidden; background:#fff; } .factory-accessory-detail-table{ width:100%; border-collapse:collapse; table-layout:fixed; } .factory-accessory-detail-table th, .factory-accessory-detail-table td{ border-bottom:1px solid #dedfe1; padding:17px 20px; font-size:16px; vertical-align:middle; } .factory-accessory-detail-table thead th{ background:#f7f7f7; color:#293241; font-weight:850; text-align:left; white-space:nowrap; } .factory-accessory-detail-table th:nth-child(1){width:12%} .factory-accessory-detail-table th:nth-child(2){width:20%} .factory-accessory-detail-table th:nth-child(3){width:15%} .factory-accessory-detail-table th:nth-child(4){width:15%} .factory-accessory-detail-table th:nth-child(5){width:14%} .factory-accessory-detail-table th:nth-child(6){width:14%} .factory-accessory-detail-table th:nth-child(7){width:10%} .factory-accessory-detail-table td.money, .factory-accessory-detail-table th.money{text-align:center} .factory-accessory-detail-table tbody tr:last-child td{border-bottom:0} .factory-accessory-merged-code, .factory-accessory-merged-name{ vertical-align:middle!important; background:#fff; } .factory-accessory-merged-code strong{font-size:17px;color:#111} .factory-accessory-merged-name{font-size:17px!important} .factory-accessory-classification{font-weight:500} .factory-accessory-unit{text-align:center} .factory-accessory-negative{color:#c20d0d;font-weight:900} .factory-accessory-positive{color:#07883f;font-weight:900} .factory-accessory-detail-footer{ display:flex; justify-content:space-between; align-items:center; gap:18px; margin-top:20px; padding:20px 22px; border:1px solid #d8dadd; border-radius:8px; background:#fff; font-size:16px; } .factory-accessory-detail-count{display:flex;align-items:center;gap:8px} .factory-accessory-detail-total{display:flex;align-items:center;gap:24px} .factory-accessory-detail-total strong{font-size:22px} .factory-accessory-footer-unit{font-size:16px;color:#222} .factory-accessory-row{cursor:pointer} .factory-accessory-row:hover{background:#fafafa} @media(max-width:900px){ #factoryAccessoryDetailModal .dialog{padding:18px} .factory-accessory-detail-table-wrap{overflow-x:auto} .factory-accessory-detail-table{min-width:980px} .factory-accessory-detail-footer{align-items:flex-start;flex-direction:column} .factory-accessory-detail-total{width:100%;justify-content:flex-end} } .factory-accessory-detail-table tbody tr.group-white td{background:#ffffff} .factory-accessory-detail-table tbody tr.group-gray td{background:#f7f7f7} .factory-accessory-detail-table tbody tr.group-white:hover td, .factory-accessory-detail-table tbody tr.group-gray:hover td{background:#f2f4f7} .factory-accessory-detail-table td[rowspan]{background:inherit} .accessory-issue-item .ai-classification{font-weight:700} #accessoryOrderModal .dialog,#accessoryIssueModal .dialog{width:min(98vw,1700px);max-width:1700px} #accessoryOrderItems,#accessoryIssueItems{display:grid;gap:8px} .compact-accessory-order-row{ display:grid; grid-template-columns:42px minmax(210px,1.6fr) 120px 120px minmax(230px,1.5fr) 130px 120px 110px 110px 110px minmax(150px,1fr) 150px auto; gap:8px;align-items:end;padding:10px 12px;border:1px solid var(--line);border-radius:9px;background:#fff;min-width:1450px } .compact-accessory-issue-row{ display:grid;grid-template-columns:minmax(250px,2fr) minmax(150px,1fr) 130px 150px minmax(220px,1.5fr) auto; gap:8px;align-items:end;padding:10px 12px;border:1px solid var(--line);border-radius:9px;background:#fff;min-width:980px } #accessoryOrderItems,#accessoryIssueItems{overflow-x:auto;padding-bottom:4px} .compact-field{min-width:0} .compact-field label{display:block;font-size:10px;font-weight:800;color:#667085;margin-bottom:4px;white-space:nowrap} .compact-field input,.compact-field select{width:100%;min-width:0;height:36px;padding:6px 8px} .compact-order-index{align-self:center;text-align:center;font-weight:900;font-size:14px} .compact-input-unit{display:flex;align-items:center;gap:5px} .compact-input-unit span,.compact-unit{font-size:10px;font-weight:700;white-space:nowrap;color:#667085} .compact-classifications{align-self:stretch} .compact-class-head{display:flex;align-items:center;justify-content:space-between} .mini-add-class{padding:1px 7px!important;min-height:22px!important;height:22px!important;font-size:13px!important} .accessory-order-colors{display:flex!important;gap:5px!important;flex-wrap:nowrap;overflow-x:auto;padding-bottom:1px} .accessory-order-color-row{display:grid!important;grid-template-columns:100px 68px auto 25px!important;gap:3px!important;align-items:center!important;padding:0!important;border:0!important;background:transparent!important;min-width:205px} .accessory-order-color-row select,.accessory-order-color-row input{height:36px!important;padding:5px 6px!important;font-size:11px} .accessory-order-color-row .accessory-color-remove{height:30px!important;min-height:30px!important;padding:2px 6px!important} .compact-total{font-size:11px;line-height:1.25;align-self:center;text-align:right;min-width:130px} .compact-delete{align-self:end;height:36px} .compact-accessory-order-row .accessory-import-costs{padding-top:0!important;border-top:0!important} .compact-accessory-order-row .ao-base-preview{font-size:9px;line-height:1.15;margin-top:2px} @media(max-width:1100px){ #accessoryOrderModal .dialog,#accessoryIssueModal .dialog{width:98vw;padding:16px} } #accessoryOrderModal .dialog{width:min(99vw,1780px);max-width:1780px} .accessory-order-list-wrap{border:1px solid var(--line);border-radius:9px;overflow-x:auto;background:#fff} .accessory-order-table-head,.accessory-order-table-row{display:grid;grid-template-columns:55px minmax(240px,1.55fr) 135px minmax(300px,1.9fr) 150px 135px 150px 145px 150px 95px;min-width:1560px;align-items:stretch} .accessory-order-table-head{background:#f7f7f8;border-bottom:1px solid var(--line);font-weight:850}.accessory-order-table-head>div{padding:15px 12px;display:flex;align-items:center} .accessory-order-table-row{position:relative;border-bottom:1px solid var(--line);min-height:104px}.accessory-order-table-row:last-child{border-bottom:0} .ao-cell{padding:14px 10px;display:flex;align-items:center;min-width:0}.ao-cell select,.ao-cell input{width:100%;height:42px;padding:7px 9px}.ao-stt{justify-content:center;font-weight:850} .ao-unit-cell{display:block;padding-top:18px}.ao-unit-cell .ao-base-preview{margin-top:5px;font-size:11px}.accessory-order-colors{display:flex!important;gap:8px!important;align-items:flex-end;overflow-x:auto;width:100%} .accessory-order-color-row{display:block!important;min-width:52px!important;padding:0!important;border:0!important;background:transparent!important}.ao-class-label{text-align:center;font-size:11px;font-weight:800;margin-bottom:5px;white-space:nowrap}.accessory-order-color-row .ao-color-qty{width:52px!important;height:42px!important;text-align:center;padding:5px!important} .accessory-no-color-label{white-space:nowrap}.ao-qty-with-unit{display:flex;align-items:center;gap:7px;width:100%}.ao-qty-with-unit span{font-size:12px;white-space:nowrap}.ao-class-total{width:100%;text-align:center;white-space:nowrap}.ao-convert-cell{font-size:13px;line-height:1.45}.ao-total-cell{font-size:14px;white-space:nowrap}.ao-action-cell{justify-content:center} .ao-import-fees{grid-column:2/-1;display:flex;gap:12px;padding:8px 10px 12px;border-top:1px dashed var(--line);background:#fcfcfd}.ao-import-fees>div{display:flex;align-items:center;gap:6px;font-size:11px;font-weight:700}.ao-import-fees input{width:110px;height:32px} .accessory-order-list-footer{min-width:1560px;display:flex;justify-content:space-between;align-items:center;padding:17px 28px;border-top:1px solid var(--line);font-size:15px}.accessory-order-list-footer>div strong{font-size:19px;margin-left:8px} #accessoryIssueModal .dialog{width:min(99vw,1650px);max-width:1650px} .accessory-issue-list-wrap{border:1px solid var(--line);border-radius:9px;overflow-x:auto;background:#fff} .accessory-issue-table-head,.accessory-issue-table-row{display:grid;grid-template-columns:55px minmax(250px,1.7fr) 90px minmax(330px,2fr) 150px 140px minmax(180px,1.2fr) 95px;min-width:1320px;align-items:stretch} .accessory-issue-table-head{background:#f7f7f8;border-bottom:1px solid var(--line);font-weight:850} .accessory-issue-table-head>div{padding:15px 12px;display:flex;align-items:center} .accessory-issue-table-row{min-height:105px;border-bottom:1px solid var(--line)} .accessory-issue-table-row:last-child{border-bottom:0} .ai-cell{padding:14px 10px;display:flex;align-items:center;min-width:0} .ai-cell select,.ai-cell input{width:100%;height:42px;padding:7px 9px} .ai-stt{justify-content:center;font-weight:850} .ai-unit,.ai-action{justify-content:center} .ai-class-cell{align-items:center} .accessory-issue-classifications{display:flex;gap:8px;overflow-x:auto;width:100%;align-items:flex-end} .accessory-issue-classification{min-width:62px;text-align:center} .ai-class-label{font-size:11px;font-weight:850;margin-bottom:5px;white-space:nowrap} .ai-class-qty{width:58px!important;text-align:center} .ai-class-stock{font-size:9px;color:#667085;margin-top:4px;white-space:nowrap} .accessory-issue-no-class{white-space:nowrap} .ai-total-qty,.ai-stock-total{gap:6px;justify-content:center;white-space:nowrap} .ai-total-unit,.ai-stock-unit{font-size:12px;color:#667085} .ai-direct-qty-wrap{display:flex;align-items:center;gap:6px;width:100%} .ai-total-qty-input[readonly]{background:#eef0f2!important;color:#344054!important;font-weight:850;text-align:center;cursor:not-allowed} .accessory-issue-list-footer{min-width:1320px;display:flex;justify-content:space-between;align-items:center;padding:17px 28px;border-top:1px solid var(--line);font-size:15px;background:#fff} .accessory-issue-list-footer strong{font-size:19px;margin-left:8px} @media(max-width:1100px){#accessoryIssueModal .dialog{width:99vw;padding:14px}} /* V3.37.1 Stable - Căn giữa toàn bộ tiêu đề bảng và dữ liệu theo cột */ table th, table td{ text-align:center!important; vertical-align:middle!important; } table th.money, table td.money{ text-align:center!important; } .table th, .table td{ text-align:center!important; vertical-align:middle!important; } /* Các bảng dạng grid tùy biến */ .accessory-order-table-head>div, .accessory-order-table-row>.ao-cell, .accessory-issue-table-head>div, .accessory-issue-table-row>.ai-cell{ justify-content:center!important; text-align:center!important; } .accessory-order-table-row input, .accessory-order-table-row select, .accessory-issue-table-row input, .accessory-issue-table-row select{ text-align:center!important; } .accessory-order-table-row select, .accessory-issue-table-row select{ text-align-last:center!important; } .accessory-order-table-row .ao-base-preview, .accessory-order-table-row .ao-conversion-display, .accessory-order-table-row .accessory-item-total, .accessory-issue-table-row .ai-class-stock{ text-align:center!important; } .factory-accessory-detail-table th, .factory-accessory-detail-table td{ text-align:center!important; vertical-align:middle!important; } .ai-unit{display:block!important;padding-top:14px!important} .ai-unit .ai-issue-unit{width:100%;height:38px} .ai-unit-conversion{font-size:9px!important;margin-top:4px;text-align:center} .ai-class-convert{font-size:9px;color:#344054;margin-top:3px;white-space:nowrap} .ai-class-stock{font-size:8px!important;line-height:1.25;white-space:nowrap} .accessory-order-data-row{cursor:pointer} .accessory-order-data-row:hover{background:#fafafa} .accessory-order-data-row button, .accessory-order-data-row input, .accessory-order-data-row select, .accessory-order-data-row textarea, .accessory-order-data-row a{cursor:auto} .accessory-issue-data-row{cursor:pointer}.accessory-issue-data-row:hover{background:#fafafa}#accessoryIssueDetailModal .dialog{width:min(96vw,1200px);max-width:1200px} .purchase-saved-toggle{min-width:82px} .purchase-saved-toggle.is-saved{font-weight:850} .purchase-saved-toggle.is-unsaved{color:#667085;border-color:#d0d5dd;background:#fff} #reportsTable table{min-width:1500px} /* Trạng thái chứng từ Báo cáo mua hàng */ .purchase-state-toggle{min-width:88px;font-weight:800!important} .purchase-state-saved{ background:#eaf7ee!important; color:#237a3b!important; border:1px solid #a9d7b5!important; } .purchase-state-unsaved{ background:#fff!important; color:#111!important; border:1px solid #111!important; } .purchase-state-saved:hover{background:#dff2e5!important} .purchase-state-unsaved:hover{background:#f5f5f5!important} .purchase-doc-cell{min-width:105px} .purchase-doc-gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:14px} .purchase-doc-card{border:1px solid var(--line);border-radius:10px;padding:10px;background:#fff} .purchase-doc-card img{width:100%;height:170px;object-fit:cover;border-radius:7px;cursor:zoom-in;border:1px solid var(--line)} .purchase-doc-meta{padding:8px 2px;min-height:54px} #purchaseDocumentModal .dialog{width:min(94vw,1100px);max-width:1100px} #reportsTable table{min-width:1650px} #outgoingDocumentsTable table{min-width:1650px} .purchase-image-lightbox{position:fixed!important;inset:0!important;width:100vw!important;height:100vh!important;padding:0!important;z-index:99999!important;background:rgba(0,0,0,.92)!important;align-items:center!important;justify-content:center!important} .purchase-image-lightbox.open{display:flex!important;position:fixed!important;inset:0!important;width:100vw!important;height:100vh!important} .purchase-image-stage{width:100vw;height:100vh;overflow:auto;display:flex;align-items:center;justify-content:center;cursor:zoom-in} .purchase-image-stage img{max-width:92%;max-height:92%;object-fit:contain;transform-origin:center center;transition:transform .15s ease;cursor:zoom-in} .purchase-image-close{position:fixed;right:24px;top:18px;width:46px;height:46px;border:0;border-radius:50%;background:rgba(255,255,255,.15);color:#fff;font-size:34px;line-height:40px;cursor:pointer;z-index:2502} .purchase-image-nav{position:fixed;top:50%;transform:translateY(-50%);width:52px;height:72px;border:0;border-radius:10px;background:rgba(255,255,255,.14);color:#fff;font-size:48px;cursor:pointer;z-index:2502} .purchase-image-prev{left:20px}.purchase-image-next{right:20px} .purchase-image-toolbar{position:fixed;bottom:18px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:8px;padding:7px 10px;border-radius:10px;background:rgba(255,255,255,.94);z-index:2502} #purchaseDocumentZoomLabel{min-width:54px;text-align:center;font-weight:800} body.purchase-image-open{overflow:hidden!important} .purchase-image-lightbox .purchase-image-stage{ position:absolute!important;inset:0!important; display:flex!important;align-items:center!important;justify-content:center!important; overflow:auto!important;background:rgba(0,0,0,.94)!important; } .purchase-image-lightbox #purchaseDocumentLargeImage{ display:block!important; max-width:94vw!important;max-height:92vh!important; width:auto!important;height:auto!important; object-fit:contain!important; box-shadow:0 8px 40px rgba(0,0,0,.45); } .purchase-image-lightbox .purchase-image-close, .purchase-image-lightbox .purchase-image-nav, .purchase-image-lightbox .purchase-image-toolbar{z-index:100001!important} #purchaseDocumentImageModal.purchase-image-lightbox{ display:none;position:fixed!important;inset:0!important;width:100vw!important;height:100vh!important; background:rgba(0,0,0,.94)!important;z-index:2147483647!important;padding:0!important; align-items:center!important;justify-content:center!important; } #purchaseDocumentImageModal.purchase-image-lightbox.open{display:flex!important} #purchaseDocumentImageModal .purchase-image-stage{position:absolute;inset:0;width:100vw;height:100vh;display:flex;align-items:center;justify-content:center;overflow:auto} #purchaseDocumentImageModal #purchaseDocumentLargeImage{max-width:94vw;max-height:92vh;width:auto;height:auto;object-fit:contain;cursor:zoom-in;transform-origin:center} .purchase-doc-thumb{cursor:zoom-in!important} #dashboard .dashboard-top h1{font-weight:950!important;letter-spacing:.02em} .dashboard-section-title{font-size:13px;font-weight:900;letter-spacing:.04em;margin:8px 0 10px;color:#222} .dashboard-stats{margin-bottom:22px} #dashboardProductionStats{grid-template-columns:repeat(5,minmax(0,1fr))} .dashboard-grid{display:grid;grid-template-columns:1.45fr 1fr;gap:14px;margin-bottom:14px} .dashboard-card{min-width:0} .dashboard-card .toolbar{margin-bottom:10px} .dashboard-alert-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 2px;border-bottom:1px solid var(--line)} .dashboard-alert-row:last-child{border-bottom:0} .dashboard-inventory-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px} .dashboard-inventory-grid>div{border:1px solid var(--line);border-radius:9px;padding:13px;background:#fafafa;display:flex;flex-direction:column;gap:6px;text-align:center} .dashboard-inventory-grid span{font-size:11px;color:var(--muted);font-weight:700} .dashboard-inventory-grid strong{font-size:18px} @media(max-width:1100px){.dashboard-grid{grid-template-columns:1fr}#dashboardProductionStats{grid-template-columns:repeat(2,minmax(0,1fr))}} /* Dashboard menu */ .sidebar .nav .dashboard-menu-button{ font-weight:900!important; letter-spacing:.01em; } .sidebar .nav .dashboard-menu-button.active{ font-weight:950!important; } /* Dashboard charts */ .dashboard-chart-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-bottom:18px} .dashboard-chart-card{min-height:270px;padding:18px} .dashboard-chart-title{font-size:15px;font-weight:900;margin-bottom:3px} .dash-bar-chart{display:flex;flex-direction:column;gap:18px;margin-top:30px} .dash-bar-row{display:grid;grid-template-columns:105px 1fr 105px;gap:10px;align-items:center} .dash-bar-label{font-size:12px;font-weight:800;text-align:right} .dash-bar-track{height:22px;border-radius:7px;background:#eceef1;overflow:hidden} .dash-bar-fill{height:100%;min-width:3px;border-radius:7px;background:#222} .dash-bar-value{font-size:12px;font-weight:850;white-space:nowrap} .dash-donut-wrap{display:flex;align-items:center;justify-content:center;gap:24px;margin-top:20px;min-height:190px} .dash-donut{--p1:0%;--p2:0%;width:160px;height:160px;border-radius:50%;background:conic-gradient(#222 0 var(--p1),#777 var(--p1) var(--p2),#d7d9dd var(--p2) 100%);display:flex;align-items:center;justify-content:center;flex:0 0 auto} .dash-donut:before{content:"";position:absolute} .dash-donut-center{width:96px;height:96px;border-radius:50%;background:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center} .dash-donut-center strong{font-size:25px;line-height:1} .dash-donut-center span{font-size:10px;color:var(--muted);margin-top:5px} .dash-donut-legend{display:flex;flex-direction:column;gap:11px;min-width:135px} .dash-donut-legend>div{display:grid;grid-template-columns:10px 1fr auto;gap:7px;align-items:center;font-size:11px} .dash-dot{width:9px;height:9px;border-radius:50%;display:inline-block}.dash-dot-1{background:#222}.dash-dot-2{background:#777}.dash-dot-3{background:#d7d9dd} @media(max-width:1250px){.dashboard-chart-grid{grid-template-columns:1fr}.dashboard-chart-card{min-height:auto}.dash-donut-wrap{justify-content:flex-start}} /* V3.37.1 Stable - Ẩn chỉ số giá/tiền theo người dùng */ body.hide-price-values .money, body.hide-price-values [data-price], body.hide-price-values .price-value, body.hide-price-values .currency-value, body.hide-price-values .debt-value{ color:transparent!important; position:relative; user-select:none; } body.hide-price-values .money::after, body.hide-price-values [data-price]::after, body.hide-price-values .price-value::after, body.hide-price-values .currency-value::after, body.hide-price-values .debt-value::after{ content:'••••••'; color:#777!important; position:absolute; left:50%; transform:translateX(-50%); white-space:nowrap; } body.hide-price-values input.money-input, body.hide-price-values input[id*="Price"], body.hide-price-values input[id*="price"], body.hide-price-values input[id*="Cost"], body.hide-price-values input[id*="cost"], body.hide-price-values input[id*="Amount"], body.hide-price-values input[id*="amount"]{ -webkit-text-security:disc; color:#777!important; } body.hide-price-values .dashboard-stat .value.price-sensitive{ color:transparent!important; } /* V3.37.1 Stable - User permission UI */ #userModal{padding:18px} #userModal .user-account-legacy-card{display:none!important} #companyMemberDetailModal .dialog{width:min(94vw,820px)!important;max-width:820px!important} .company-member-detail-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:14px 0} .company-member-detail-item{padding:11px 12px;border:1px solid rgba(0,0,0,.2);border-radius:8px;background:#fff} .company-member-detail-item span{display:block;color:#667085;font-size:11px;margin-bottom:4px}.company-member-detail-item strong{overflow-wrap:anywhere} .company-member-permissions{padding:12px;border:1px solid rgba(0,0,0,.2);border-radius:8px;margin-top:10px}.company-member-permissions .badge{margin:3px} .company-member-password-note{margin-top:12px;padding:12px;border:1px solid #e0b75b;border-radius:8px;background:#fffaf0} @media(max-width:600px){.company-member-detail-grid{grid-template-columns:1fr}} /* V3.37.21 - Sidebar Collapsible / Accordion trên desktop */ @media(min-width:901px){ .sidebar .nav-parent.roway-accordion-parent{position:relative;display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:38px;margin:10px 0 2px!important;padding:10px 28px 10px 10px!important;border-top:1px solid #292929;border-radius:8px;cursor:pointer;user-select:none;transition:background .2s ease,color .2s ease} .sidebar .nav-parent.roway-accordion-parent:hover,.sidebar .nav-parent.roway-accordion-parent:focus-visible{background:#202020;outline:none} .sidebar .nav-parent.roway-accordion-parent.has-active-child{color:#fff;background:#1c1c1c} .sidebar .roway-accordion-arrow{position:absolute;right:10px;top:50%;display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;color:#9a9a9a;font-size:18px;line-height:1;transform:translateY(-50%) rotate(0deg);transition:transform .26s ease,color .2s ease} .sidebar .nav-parent.roway-accordion-parent.is-open .roway-accordion-arrow{transform:translateY(-50%) rotate(90deg);color:#fff} .sidebar .nav-parent.roway-accordion-parent+.nav-children{max-height:0!important;opacity:0;overflow:hidden;padding-left:8px!important;transform:translateY(-4px);pointer-events:none;transition:max-height .32s ease,opacity .22s ease,transform .28s ease} .sidebar .nav-parent.roway-accordion-parent.is-open+.nav-children{max-height:1000px!important;opacity:1;transform:translateY(0);pointer-events:auto} .sidebar .nav-children button.active{background:#2A2B2E!important;color:#fff!important;font-weight:700;border-left:none!important;box-shadow:none!important} } @media(max-width:900px){ .sidebar .nav-parent.roway-accordion-parent{cursor:default!important} .sidebar .nav-parent.roway-accordion-parent+.nav-children{display:block!important;max-height:none!important;opacity:1!important;overflow:visible!important;transform:none!important;pointer-events:auto!important} .sidebar .roway-accordion-arrow{display:none!important} } .user-dialog{width:min(98vw,1380px)!important;max-width:1380px!important;background:#f7f8fa!important;border-radius:16px!important;padding:0!important;max-height:96vh!important;overflow:auto!important} .user-dialog-head{display:flex;justify-content:space-between;align-items:flex-start;padding:24px 28px 18px;border-bottom:0} .user-dialog-head h2{font-size:27px;margin:0 0 4px;font-weight:900} .user-close-btn{font-weight:800;min-width:110px} .user-account-card,.user-permission-card{background:#fff;border:1px solid var(--line);border-radius:13px;margin:0 20px 14px;padding:20px 26px;box-shadow:0 1px 4px rgba(0,0,0,.04)} .user-account-card h3,.user-permission-card h3{font-size:16px;margin:0 0 17px;font-weight:900} .user-account-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px} .user-account-grid label{font-size:12px;font-weight:700;color:#333} .user-account-grid input,.user-account-grid select{margin-top:7px;width:100%;height:48px;border:1px solid #d6d9de;border-radius:8px;padding:0 14px;background:#fff;font-size:14px} .user-account-grid input:disabled{background:#f5f6f7;color:#80858d} .pin-field{position:relative}.pin-field input{padding-right:42px}.pin-eye{position:absolute;right:10px;top:18px;border:0;background:transparent;cursor:pointer;color:#555;font-size:16px} .user-switch-row{display:flex;gap:28px;align-items:center;margin-top:20px;flex-wrap:wrap} .switch-label{display:flex;align-items:center;gap:10px;font-size:13px} .switch{position:relative;width:44px;height:24px;display:inline-block}.switch input{opacity:0;width:0;height:0}.switch-slider{position:absolute;inset:0;background:#c9ced6;border-radius:20px;transition:.2s}.switch-slider:before{content:"";position:absolute;width:18px;height:18px;left:3px;top:3px;background:#fff;border-radius:50%;transition:.2s;box-shadow:0 1px 3px rgba(0,0,0,.25)}.switch input:checked+.switch-slider{background:#2575ed}.switch input:checked+.switch-slider:before{transform:translateX(20px)} .user-permission-card{padding-bottom:22px} .user-permission-top{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:16px} .user-permission-title-line{display:flex;align-items:center;gap:12px}.user-permission-title-line h3{margin:0} .permission-count{border:1px solid #7eb0ff;background:#f3f8ff;color:#2b78e8;padding:4px 10px;border-radius:999px;font-size:11px;font-weight:700} .user-permission-actions{display:flex;gap:10px}.user-permission-actions .btn{min-width:105px} .permission-group{margin:18px 0 4px}.permission-group-title{display:flex;align-items:center;gap:8px;margin-bottom:9px;font-size:13px}.permission-group-title strong{font-weight:900} .permission-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px 12px} .permission-item{min-height:46px;border:1px solid #d9dce1;border-radius:8px;padding:0 14px;display:flex;align-items:center;gap:10px;background:#fff;cursor:pointer;font-size:13px;transition:.12s} .permission-item:hover{border-color:#9ebff5;background:#fafcff} .permission-item.selected{border-color:#76aaff;background:#f7faff;box-shadow:0 0 0 1px rgba(62,130,240,.08)} .permission-item input{width:16px!important;height:16px!important;accent-color:#2878ed;flex:0 0 auto} .user-dialog-actions{position:sticky;bottom:0;background:#f7f8fa;padding:0 20px 18px;display:flex;justify-content:flex-end;gap:10px} .user-dialog-actions .btn{min-width:90px;height:45px}.user-save-btn{min-width:180px!important;font-weight:900!important} @media(max-width:1050px){.user-account-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.permission-grid{grid-template-columns:repeat(2,minmax(0,1fr))}} @media(max-width:650px){.user-account-grid,.permission-grid{grid-template-columns:1fr}.user-permission-top{flex-direction:column}.user-dialog-head{padding:18px}.user-account-card,.user-permission-card{margin:0 10px 12px;padding:16px}.user-switch-row{flex-direction:column;align-items:flex-start}} .fabric-product-row{cursor:pointer} .fabric-product-row:hover{background:#fafafa} #fabricProductDetailModal .dialog{width:min(94vw,1050px);max-width:1050px} #fabricProductDetailContent .stats{grid-template-columns:repeat(4,minmax(0,1fr))} @media(max-width:900px){#fabricProductDetailContent .stats{grid-template-columns:repeat(2,minmax(0,1fr))}} /* V3.37.1 Stable - tài khoản đăng nhập ở cuối Hệ thống & Báo cáo */ .sidebar-account-row{ margin:10px 0 0 8px; padding:12px 10px 4px 12px; border-top:1px solid #292929; display:flex; align-items:center; justify-content:space-between; gap:8px; color:#fff; font-size:12px; } #sidebarUser{font-weight:750;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .sidebar-logout-btn{ border:0;background:transparent;color:#aaa;cursor:pointer; font-size:12px;font-weight:750;padding:5px 2px;flex:0 0 auto; } .sidebar-logout-btn:hover{color:#fff;text-decoration:underline} /* V3.37.1 Stable - Chi tiết giá vốn sản phẩm vải & phụ liệu */ .product-cost-dialog, #accessoryInventoryDetailModal .dialog{ width:min(97vw,1500px)!important; max-width:1500px!important; padding:0!important; border-radius:17px!important; overflow:hidden!important; background:#fff!important; } .product-cost-head, #accessoryInventoryDetailModal .dialog-head{ display:flex;justify-content:space-between;align-items:flex-start; padding:28px 38px 18px!important;margin:0!important; } .product-cost-head h2, #accessoryInventoryDetailModal .dialog-head h2{ margin:0 0 8px;font-size:31px;font-weight:900;letter-spacing:-.025em;color:#0f1d3a; } .product-cost-sub, #accessoryInventoryDetailModal .dialog-head .small{font-size:15px!important;color:#62708a} .product-code-pill{display:inline-block;margin-left:12px;padding:6px 12px;border:1px solid #d6dbe4;border-radius:9px;background:#f7f8fa;color:#536078;font-size:13px;font-weight:700} .product-cost-close{min-width:120px;height:48px;font-size:14px} #fabricProductDetailContent,#accessoryInventoryDetailContent{padding:10px 38px 0} .product-cost-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;margin:12px 0 38px} .product-cost-stat{border:1px solid #d5dbe5;border-radius:17px;padding:30px 28px;min-height:235px;background:#fff} .product-cost-stat.primary-cost{border-color:#6da3ff;background:linear-gradient(135deg,#fff 0%,#f7faff 100%)} .product-cost-label{display:flex;align-items:center;gap:14px;font-size:16px;font-weight:800;color:#17233e} .cost-icon{font-size:30px;color:#1f6dea;line-height:1} .product-cost-value{font-size:38px;font-weight:900;letter-spacing:-.025em;margin:28px 0 18px;color:#0c1730} .primary-cost .product-cost-value{color:#2267d8} .product-cost-note{font-size:15px;line-height:1.45;color:#647089} .product-cost-section-head{display:flex;justify-content:space-between;align-items:center;gap:16px;margin:0 0 18px} .product-cost-section-head h3{margin:0;font-size:20px;font-weight:900;color:#111b30} .product-cost-info{font-size:13px;font-weight:700;color:#48546d} .product-cost-table-wrap{border:1px solid #d7dce5;border-radius:12px;overflow:hidden} .product-cost-table{width:100%;border-collapse:collapse} .product-cost-table th{background:#f6f8fb;color:#445169;font-size:12px;font-weight:900;letter-spacing:.02em;padding:17px 26px;text-align:center;border-bottom:1px solid #d7dce5} .product-cost-table td{padding:20px 26px;font-size:16px;border-bottom:1px solid #e0e4ea;text-align:center} .product-cost-table tbody tr:last-child td{border-bottom:0} .product-cost-table .order-link{color:#1761d1} .product-cost-extra{margin-top:28px} .product-cost-footer{margin:28px -38px 0;padding:24px 38px;border-top:1px solid #e0e4ea;background:#fff;display:flex;align-items:center;justify-content:space-between;gap:16px;font-size:15px;color:#263653} .product-cost-done{min-width:140px;height:50px;font-size:16px} @media(max-width:1100px){.product-cost-stats{grid-template-columns:repeat(2,minmax(0,1fr))}} @media(max-width:700px){ .product-cost-head,#accessoryInventoryDetailModal .dialog-head{padding:20px!important} #fabricProductDetailContent,#accessoryInventoryDetailContent{padding:8px 20px 0} .product-cost-head h2,#accessoryInventoryDetailModal .dialog-head h2{font-size:24px} .product-cost-stats{grid-template-columns:1fr;gap:12px} .product-cost-stat{min-height:auto;padding:22px} .product-cost-value{font-size:30px;margin:18px 0 10px} .product-cost-section-head,.product-cost-footer{flex-direction:column;align-items:flex-start} .product-cost-footer{margin-left:-20px;margin-right:-20px;padding:20px} } /* V3.37.1 Stable - báo cáo giá trị tồn kho */ #fabricInventoryValueReport .stats,#accessoryInventoryValueReport .stats,#productionInventoryValueReport .stats{grid-template-columns:repeat(4,minmax(0,1fr))} #fabricInventoryValueReport table,#accessoryInventoryValueReport table,#productionInventoryValueReport table{min-width:1100px} #productionInventoryValueReport table{min-width:1500px} @media(max-width:900px){#fabricInventoryValueReport .stats,#accessoryInventoryValueReport .stats,#productionInventoryValueReport .stats{grid-template-columns:repeat(2,minmax(0,1fr))}} /* V3.37.1 Stable - tính giá thành bàn sản xuất */ #productionCostModal .production-cost-dialog{width:min(96vw,1250px);max-width:1250px} .production-cost-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:16px} .production-cost-stats .primary-cost{border-color:#8ab4ff;background:#f7faff} .production-cost-labor{display:grid;grid-template-columns:1fr minmax(260px,360px) auto;gap:16px;align-items:center;margin-bottom:18px} .production-cost-labor-input{display:flex;align-items:center;gap:8px} .production-cost-labor-input input{width:190px;padding:10px 12px;border:1px solid var(--line);border-radius:8px;text-align:right;font-weight:800} .production-cost-summary{margin-top:20px;border:1px solid var(--line);border-radius:12px;overflow:hidden} .production-cost-summary-row{display:flex;justify-content:space-between;gap:20px;padding:12px 16px;border-bottom:1px solid var(--line);background:#fff} .production-cost-summary-row:last-child{border-bottom:0} .production-cost-summary-row.total{background:#f7f7f7;font-weight:900} .production-cost-summary-row.unit{background:#111;color:#fff;font-size:17px;font-weight:900} .production-cost-summary-row.unit .money{color:inherit} @media(max-width:900px){.production-cost-stats{grid-template-columns:repeat(2,minmax(0,1fr))}.production-cost-labor{grid-template-columns:1fr}} /* V3.37.1 Stable - Xưởng sản xuất & Sản phẩm thành phẩm thành danh mục riêng */ #factories .stats,#finishedProducts .stats{grid-template-columns:repeat(4,minmax(0,1fr))} #factoryPageList table,#finishedProductPageList table{min-width:1050px} #finishedProductPageList table{min-width:1350px} @media(max-width:900px){#factories .stats,#finishedProducts .stats{grid-template-columns:repeat(2,minmax(0,1fr))}} /* V3.37.1 Stable */ .production-done-text{color:#16823b!important;border-color:#9bd2aa!important;background:#f1fbf4!important;font-weight:850!important} .accessory-consumption-updated{color:#16823b!important;font-weight:850!important} .production-cost-basis-card{display:grid;grid-template-columns:1fr minmax(330px,520px);gap:18px;align-items:center;margin-bottom:14px} .production-cost-basis-card select{height:44px;border:1px solid var(--line);border-radius:8px;padding:0 12px;background:#fff;font-weight:700} .production-cost-temp-note{padding:12px 16px;background:#fff8e6;border-bottom:1px solid #f1d799;color:#8b5d00;font-weight:850;font-size:13px} .finished-product-view-row{cursor:pointer}.finished-product-view-row:hover{background:#fafafa} #finishedProductDetailModal{padding:18px!important} #finishedProductDetailModal .product-cost-dialog{width:min(94vw,1280px)!important;max-width:1280px!important;max-height:90vh!important;padding:18px!important} #finishedProductDetailModal #finishedProductDetailContent{width:100%;min-width:0} #finishedProductDetailModal .product-cost-table-wrap{width:100%;max-width:100%;overflow-x:auto!important} #finishedProductDetailModal .product-cost-table-wrap table{width:max(100%,900px)!important} @media(max-width:700px){#finishedProductDetailModal{padding:6px!important}#finishedProductDetailModal .product-cost-dialog{width:calc(100vw - 12px)!important;max-width:calc(100vw - 12px)!important;max-height:calc(100vh - 12px)!important;padding:12px!important;border-radius:10px!important}#finishedProductDetailModal .product-cost-table-wrap table{width:max(100%,720px)!important}} @media(max-width:900px){.production-cost-basis-card{grid-template-columns:1fr}} /* V3.37.1 Stable - đơn giá gia công mặc định theo thành phẩm */ #finishedProductProcessingCost{font-weight:800;text-align:right} /* V3.37.1 Stable - trạng thái giá thành tạm tính màu xanh dương */ .production-temp-cost-text{ color:#1769d2!important; border-color:#9fc4f5!important; background:#f2f7ff!important; font-weight:850!important; } .production-temp-cost-badge{ color:#1769d2!important; border:1px solid #9fc4f5!important; background:#f2f7ff!important; font-weight:800!important; } /* V3.37.1 Stable - giá vốn và giá trị tồn trong chi tiết tồn kho vải */ .inventory-product-cost-summary{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin-bottom:14px; } .inventory-cost-card{ border:1px solid var(--line); border-radius:12px; padding:16px 18px; background:#fff; min-height:110px; } .inventory-cost-card.primary{ border-color:#8eb8ff; background:#f6f9ff; } .inventory-cost-label{font-size:12px;font-weight:800;color:#667085;margin-bottom:10px} .inventory-cost-value{font-size:22px;font-weight:900;color:#111827;margin-bottom:6px} .inventory-cost-card.primary .inventory-cost-value{color:#1769d2} @media(max-width:1000px){.inventory-product-cost-summary{grid-template-columns:repeat(2,minmax(0,1fr))}} @media(max-width:600px){.inventory-product-cost-summary{grid-template-columns:1fr}} /* V3.37.1 Stable - bảng chi tiết cây vải đang vận chuyển */ .incoming-inventory-matrix-wrap{margin-top:10px} .incoming-inventory-matrix .incoming-roll-cell{background:#fbfdff} .incoming-inventory-matrix .incoming-roll-cell:hover{background:#f1f7ff} .incoming-roll-order{margin-top:4px;font-size:10px;color:#6b7280;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:90px} .incoming-box{margin-top:22px;padding-top:18px;border-top:1px solid var(--line)} /* V3.37.1 Stable - giá trị tồn phụ liệu tại xưởng, base từ V3.32.132 */ #accessoryProduction .stats{grid-template-columns:repeat(4,minmax(0,1fr))} #accessoryProductionTable table{min-width:1250px} .factory-accessory-detail-table{min-width:1200px} .factory-accessory-detail-totals{display:flex;align-items:center;gap:8px;flex-wrap:wrap} .factory-accessory-value-label{margin-left:22px} @media(max-width:900px){#accessoryProduction .stats{grid-template-columns:repeat(2,minmax(0,1fr))}} /* V3.37.1 Stable - Tạo/Sửa đơn phụ liệu theo cấu trúc bảng mẫu */ #accessoryOrderModal{padding:10px} #accessoryOrderModal .accessory-order-editor-dialog{ width:min(99vw,1620px)!important;max-width:1620px!important; max-height:98vh!important;padding:0!important;overflow:auto!important; border-radius:15px!important;background:#f8fafc!important; } .accessory-order-editor-head{display:flex;justify-content:space-between;align-items:flex-start;padding:14px 18px 10px} .accessory-order-title-line{display:flex;align-items:center;gap:12px;flex-wrap:wrap} .accessory-order-title-line h2{font-size:25px;margin:0;font-weight:900;color:#10254d} .accessory-order-close{min-width:94px} .accessory-order-info-card{margin:0 16px 10px;background:#fff;border:1px solid #d8dde6;border-radius:9px;padding:12px 14px;box-shadow:0 1px 3px rgba(0,0,0,.025)} .accessory-order-info-card h3{font-size:16px;margin:0 0 10px;font-weight:900} .accessory-order-info-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px 18px} .accessory-order-info-grid .field{margin:0} .accessory-order-info-grid label{font-size:11px;font-weight:800;color:#566176} .accessory-order-info-grid input,.accessory-order-info-grid select,.accessory-order-info-grid textarea{min-height:36px;border-radius:6px} .accessory-order-info-grid textarea{min-height:42px;resize:vertical} .accessory-order-list-head{display:flex;justify-content:space-between;align-items:center;padding:0 16px 7px;gap:14px} .accessory-order-list-title{display:flex;align-items:center;gap:10px} .accessory-order-list-title h3{font-size:17px;margin:0;font-weight:900} .accessory-order-count-pill{font-size:11px;border:1px solid #d6dce5;background:#f2f4f7;border-radius:999px;padding:4px 8px;color:#4b5870} .accessory-order-editor-table{margin:0 16px!important;border:1px solid #d6dce5!important;border-radius:9px!important;overflow:hidden!important;background:#fff} .accessory-order-editor-table .accessory-order-table-head{background:#f8fafc!important;border-bottom:1px solid #d7dde7!important;font-size:11px!important;font-weight:900!important;min-height:39px} #accessoryOrderModal .accessory-order-table-row{min-height:58px;border-bottom:1px solid #e1e5eb} #accessoryOrderModal .ao-cell{padding-top:7px!important;padding-bottom:7px!important} #accessoryOrderModal .ao-cell input,#accessoryOrderModal .ao-cell select{height:34px!important;border-radius:6px!important} #accessoryOrderModal .ao-class-cell{min-width:220px} #accessoryOrderModal .accessory-order-colors{gap:4px!important} #accessoryOrderModal .ao-convert-cell{font-size:11px;line-height:1.45} #accessoryOrderModal .accessory-item-total{font-size:13px} #accessoryOrderModal .ao-action-cell .btn{min-width:58px} #accessoryOrderModal .accessory-import-costs{background:#fbfcfe;border-top:1px dashed #d9dee7;padding:8px 12px} .accessory-order-list-footer{min-height:42px;padding:9px 14px!important;background:#fff;display:flex!important;align-items:center;justify-content:space-between;border-top:1px solid #d7dde7} .accessory-order-list-footer #accessoryOrderListTotal{font-size:17px;color:#10254d} .accessory-order-calc-cards{grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:16px!important;margin:14px 16px 12px!important} .accessory-order-calc-cards .card{min-height:88px;border-radius:9px;padding:15px 18px} .accessory-order-calc-cards .label{font-size:11px} .accessory-order-calc-cards .value{font-size:20px} .accessory-order-total-card{border-color:#8bb4ff!important;background:#f5f9ff!important} .accessory-order-total-card .label,.accessory-order-total-card .value{color:#1559c7!important} .accessory-order-editor-footer{position:sticky;bottom:0;z-index:20;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:10px 18px;background:#fff;border-top:1px solid #d6dce6;box-shadow:0 -3px 12px rgba(20,35,60,.04)} .accessory-order-footer-summary{font-size:12px;color:#536078} .accessory-order-footer-actions{display:flex;gap:10px} .accessory-order-footer-actions .btn{height:42px;min-width:88px} .accessory-order-save-btn{min-width:138px!important;font-weight:900!important} @media(max-width:1150px){ .accessory-order-info-grid{grid-template-columns:repeat(2,minmax(0,1fr))} .accessory-order-calc-cards{grid-template-columns:repeat(2,minmax(0,1fr))!important} .accessory-order-editor-table{overflow:auto!important} } @media(max-width:700px){ .accessory-order-info-grid{grid-template-columns:1fr} .accessory-order-info-card,.accessory-order-editor-table{margin-left:8px!important;margin-right:8px!important} .accessory-order-list-head{padding-left:10px;padding-right:10px;flex-direction:column;align-items:flex-start} .accessory-order-calc-cards{grid-template-columns:1fr!important;margin-left:8px!important;margin-right:8px!important} .accessory-order-editor-footer{flex-direction:column;align-items:flex-start} .accessory-order-footer-actions{width:100%;justify-content:flex-end} } /* V3.37.1 Stable - Tạo/Sửa đơn đặt vải theo cấu trúc mẫu */ #orderModal{padding:10px} #orderModal .fabric-order-editor-dialog{width:min(99vw,1620px)!important;max-width:1620px!important;max-height:98vh!important;padding:0!important;overflow:auto!important;border-radius:15px!important;background:#f8fafc!important} .fabric-order-editor-head{display:flex;justify-content:space-between;align-items:flex-start;padding:12px 18px 8px} .fabric-order-title-line{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.fabric-order-title-line h2{font-size:25px;margin:0;font-weight:900;color:#10254d}.fabric-order-close{min-width:94px} .fabric-order-info-card{margin:0 16px 10px;background:#fff;border:1px solid #d8dde6;border-radius:9px;padding:11px 14px;box-shadow:0 1px 3px rgba(0,0,0,.025)} .fabric-order-info-card h3{font-size:16px;margin:0 0 8px;font-weight:900} .fabric-order-info-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px 18px}.fabric-order-info-grid .field{margin:0}.fabric-order-info-grid label{font-size:11px;font-weight:800;color:#566176} .fabric-order-info-grid input,.fabric-order-info-grid select,.fabric-order-info-grid textarea{min-height:36px;border-radius:6px}.fabric-order-info-grid textarea{min-height:40px;resize:vertical} .fabric-supplier-inline{display:flex;gap:10px}.fabric-supplier-inline select{flex:1}.fabric-supplier-inline .btn{min-width:98px} .fabric-order-list-head{display:flex;justify-content:space-between;align-items:center;padding:0 16px 7px;gap:12px}.fabric-order-list-title{display:flex;align-items:center;gap:10px}.fabric-order-list-title h3{font-size:17px;margin:0;font-weight:900} .fabric-order-meta-pill{font-size:11px;border:1px solid #d6dce5;background:#f2f4f7;border-radius:999px;padding:4px 8px;color:#4b5870} .fabric-order-items{padding:0 16px} .fabric-order-item-card{background:#fff!important;border:1px solid #d6dce5!important;border-radius:9px!important;padding:0!important;margin-bottom:10px!important;overflow:hidden} .fabric-item-head{display:flex;justify-content:space-between;align-items:center;padding:9px 12px 6px}.fabric-item-title-wrap{display:flex;align-items:center;gap:8px;font-size:16px}.fabric-item-code-pill{font-size:11px;padding:4px 8px;background:#edf5ff;color:#1b65c9;border:1px solid #a8c9f7;border-radius:999px;font-weight:800}.fabric-item-code-pill:empty{display:none} .fabric-item-main-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;padding:0 12px 7px}.fabric-item-main-grid label{font-size:11px;font-weight:800;color:#566176}.fabric-item-main-grid input,.fabric-item-main-grid select{height:36px;border-radius:6px} .fabric-color-section-head{display:flex;justify-content:space-between;align-items:center;padding:0 12px 6px;font-size:15px}.fabric-color-list{padding:0 12px 3px} .fabric-order-color-card{border:1px solid #dbe0e8!important;border-radius:8px!important;background:#fbfcfe!important;margin-bottom:5px!important;padding:7px 9px!important} .fabric-order-color-head{display:flex;align-items:center;justify-content:space-between;gap:12px}.fabric-order-color-main{display:flex;align-items:center;gap:9px;min-width:0}.fabric-color-swatch{width:30px;height:30px;border-radius:6px;border:1px solid rgba(0,0,0,.18);box-shadow:inset 0 0 0 1px rgba(255,255,255,.18);flex:0 0 auto} .fabric-color-field{display:flex;align-items:center;margin:0!important}.fabric-color-field label{display:none}.fabric-color-field select{height:31px;min-width:145px;font-weight:850;border:0;background:transparent;padding:0 24px 0 2px} .fabric-color-badge{font-size:11px;padding:4px 9px;border-radius:999px;background:#fff;border:1px solid #d7dce5;color:#465166;white-space:nowrap}.fabric-order-color-actions{display:flex;gap:7px}.fabric-roll-label{margin:4px 0 2px;font-size:11px} .fabric-ocr-button{border-color:#b7c8ee!important;color:#2457a7!important;background:#f5f8ff!important}.fabric-ocr-dialog{width:min(1280px,98vw)!important}.fabric-ocr-upload{padding:26px;border:2px dashed #cbd5e1;border-radius:12px;text-align:center;background:#f8fafc}.fabric-ocr-upload-actions{display:flex;gap:9px;justify-content:center;margin-bottom:9px;flex-wrap:wrap}.fabric-ocr-processing{text-align:center;padding:38px}.fabric-ocr-spinner{display:inline-block;width:25px;height:25px;border:3px solid #dbe4f0;border-top-color:#111;border-radius:50%;animation:fabricOCRSpin .8s linear infinite;margin-right:9px;vertical-align:middle}@keyframes fabricOCRSpin{to{transform:rotate(360deg)}}.fabric-ocr-layout{display:grid;grid-template-columns:minmax(280px,.8fr) minmax(520px,1.2fr);gap:14px}.fabric-ocr-image-card,.fabric-ocr-result-card{border:1px solid var(--line);border-radius:12px;padding:12px;min-width:0}.fabric-ocr-image-card img{display:block;width:100%;max-height:520px;object-fit:contain;margin-top:10px;background:#f3f4f6;border-radius:8px;cursor:zoom-in}.fabric-ocr-image-card img.zoomed{position:fixed;inset:3vh 3vw;width:94vw;max-height:94vh;z-index:2147483600;background:#111;object-fit:contain;cursor:zoom-out}.fabric-ocr-retain{display:flex;gap:7px;align-items:center;margin-top:10px;font-size:12px}.fabric-ocr-summary{display:grid;grid-template-columns:repeat(4,minmax(100px,1fr));gap:7px;margin-bottom:10px}.fabric-ocr-summary>div{padding:8px;border:1px solid #dbe1ea;border-radius:8px;background:#f8fafc;text-align:center}.fabric-ocr-summary span{display:block;font-size:10px;color:#667085}.fabric-ocr-summary strong{font-size:16px}.fabric-ocr-warning{display:none;padding:9px 11px;margin-bottom:9px;border:1px solid #f0c36b;border-radius:8px;background:#fff9e9;color:#8a5700;font-size:12px}.fabric-ocr-warning.show{display:block}.fabric-ocr-table-wrap{max-height:480px;overflow:auto;border:1px solid #dde2e9;border-radius:8px;margin-bottom:9px}.fabric-ocr-table th,.fabric-ocr-table td{text-align:center;vertical-align:middle;padding:7px}.fabric-ocr-table input[type=text]{width:120px;text-align:center}.fabric-ocr-low{background:#fff6e5!important}.fabric-ocr-order-buttons{display:flex;gap:4px;justify-content:center}.fabric-ocr-footer{display:flex;justify-content:space-between;gap:10px;margin-top:14px}.fabric-ocr-footer-right{display:flex;gap:8px}@media(max-width:760px){.fabric-ocr-layout{grid-template-columns:1fr}.fabric-ocr-summary{grid-template-columns:repeat(2,1fr)}.fabric-ocr-table-wrap{overflow-x:auto}.fabric-ocr-footer{flex-direction:column}.fabric-ocr-footer-right{display:grid;grid-template-columns:1fr 1fr}} .fabric-ocr-table-wrap,#detailModal .inventory-matrix-wrap,#issueModal .issue-matrix-wrap,#issueDetailModal .inventory-matrix-wrap{overscroll-behavior:contain;scrollbar-gutter:stable;touch-action:pan-x pan-y;-webkit-overflow-scrolling:touch} .fabric-ocr-crop{display:none;border:1px solid var(--line);border-radius:12px;padding:12px;background:#f8fafc}.fabric-ocr-crop-head{display:flex;justify-content:space-between;gap:10px;align-items:flex-start;margin-bottom:10px}.fabric-ocr-crop-stage{display:flex;justify-content:center;align-items:center;min-height:220px;max-height:58vh;overflow:auto;background:#252525;border-radius:10px;padding:8px}.fabric-ocr-crop-stage canvas{display:block;max-width:100%;height:auto;cursor:crosshair;touch-action:none;background:#fff}.fabric-ocr-crop-actions{display:flex;justify-content:space-between;gap:8px;flex-wrap:wrap;margin-top:10px}.fabric-ocr-crop-actions>div{display:flex;gap:8px;flex-wrap:wrap} @media(max-width:900px){ #detailModal .dialog,#issueModal .dialog,#issueDetailModal .dialog{width:100vw!important;max-width:100vw!important;padding:10px!important;border-radius:0!important} #detailModal .inventory-matrix-wrap,#issueModal .issue-matrix-wrap,#issueDetailModal .inventory-matrix-wrap{display:block!important;width:100%!important;max-width:100%!important;overflow-x:auto!important;overflow-y:visible!important} #detailModal .order-arrival-table{width:max-content!important;min-width:1080px!important;table-layout:auto!important} #detailModal .order-arrival-table .fabric-name{min-width:170px!important;max-width:190px!important;white-space:normal!important} #detailModal .order-arrival-table .total-col{min-width:88px!important} #detailModal .order-arrival-table .roll-col{min-width:78px!important;width:78px!important;white-space:nowrap!important} #issueModal .issue-matrix,#issueDetailModal .unified-roll-table{width:max-content!important;min-width:max-content!important;table-layout:auto!important} #issueModal .issue-matrix .issue-color-name,#issueDetailModal .unified-roll-table .issue-color-name{min-width:165px!important;width:165px!important;max-width:165px!important;white-space:normal!important} #issueModal .issue-matrix .issue-total,#issueDetailModal .unified-roll-table .issue-total{min-width:82px!important;width:82px!important;max-width:82px!important} #issueModal .issue-matrix .issue-roll-cell,#issueDetailModal .unified-roll-table .issue-roll-cell{min-width:76px!important;width:76px!important;max-width:76px!important;overflow:visible!important} #issueModal .issue-product-block{max-width:100%!important;overflow:hidden!important} #issueModal .issue-product-block-head{align-items:flex-start!important;flex-wrap:wrap!important} } #orderModal .rolls-grid{display:grid;grid-template-columns:repeat(10,minmax(0,1fr));gap:4px 12px}#orderModal .roll-chip{display:grid;grid-template-columns:1fr auto;position:relative;padding-top:14px}#orderModal .roll-chip label{position:absolute;top:0;left:3px;font-size:9.5px;color:#536075} #orderModal .roll-chip input{height:29px;border-radius:6px;text-align:center;padding:0 18px 0 5px;font-size:12px}#orderModal .roll-chip button{position:absolute;right:4px;bottom:4px;border:0;background:transparent;color:#9aa2b0;font-size:13px} .fabric-cost-panel{border-top:1px solid #dfe3ea;margin-top:4px;padding:7px 12px 9px}.fabric-cost-title{display:flex;align-items:center;gap:14px;margin-bottom:6px}.fabric-cost-title .small{font-size:10.5px}.fabric-costs{grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:14px!important}.fabric-costs .field{margin:0}.fabric-costs label{font-size:10.5px}.fabric-costs input{height:32px;border-radius:6px;text-align:right} #orderModal .fabric-item-total{display:block!important;background:#eef6ff;border:1px solid #b9d6ff;color:#164f9d;border-radius:6px;margin:0 12px 8px;padding:7px 10px;font-size:11px} .fabric-order-summary-cards{grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:14px!important;margin:10px 16px!important}.fabric-order-summary-cards .card{min-height:75px;border-radius:9px;padding:13px 16px}.fabric-order-summary-cards .small{font-size:10.5px}.fabric-order-summary-cards .value{font-size:18px}.fabric-order-total-card{border-color:#83aff8!important;background:#f4f8ff!important}.fabric-order-total-card .small,.fabric-order-total-card .value{color:#1559c7!important} .fabric-order-editor-footer{position:sticky;bottom:0;z-index:20;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:9px 18px;background:#fff;border-top:1px solid #d6dce6;box-shadow:0 -3px 12px rgba(20,35,60,.04)}.fabric-order-footer-summary{font-size:12px;color:#536078}.fabric-order-footer-actions{display:flex;gap:10px}.fabric-order-footer-actions .btn{height:40px;min-width:88px}.fabric-order-save-btn{min-width:142px!important;font-weight:900!important} @media(max-width:1200px){.fabric-order-info-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.fabric-order-summary-cards{grid-template-columns:repeat(3,minmax(0,1fr))!important}#orderModal .rolls-grid{grid-template-columns:repeat(5,minmax(0,1fr))}.fabric-costs{grid-template-columns:repeat(3,minmax(0,1fr))!important}} @media(max-width:700px){.fabric-order-info-grid,.fabric-item-main-grid{grid-template-columns:1fr}.fabric-order-info-card{margin-left:8px;margin-right:8px}.fabric-order-list-head{padding-left:10px;padding-right:10px;flex-direction:column;align-items:flex-start}.fabric-order-items{padding:0 8px}.fabric-order-color-head{align-items:flex-start;flex-direction:column}.fabric-order-color-main{flex-wrap:wrap}#orderModal .rolls-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.fabric-costs{grid-template-columns:1fr!important}.fabric-order-summary-cards{grid-template-columns:1fr!important;margin-left:8px!important;margin-right:8px!important}.fabric-order-editor-footer{flex-direction:column;align-items:flex-start}.fabric-order-footer-actions{width:100%;justify-content:flex-end}} /* V3.37.1 Stable - sửa font, cắt chữ trong bảng và nhập số thập phân bằng dấu phẩy */ html,body,button,input,select,textarea,table,th,td{ font-family:"Segoe UI",Arial,Helvetica,sans-serif!important; font-variant-ligatures:none; text-rendering:optimizeLegibility; } body{line-height:1.42} table{ width:100%; table-layout:auto!important; border-collapse:collapse; } th,td{ line-height:1.38!important; min-height:38px; height:auto!important; overflow:visible!important; text-overflow:clip!important; vertical-align:middle!important; word-break:normal!important; overflow-wrap:anywhere; } th{ white-space:normal!important; font-weight:700!important; } td{ white-space:normal!important; } td.money,th.money,.money,.nowrap{ white-space:nowrap!important; } table input,table select,table textarea{ min-width:0!important; width:100%; max-width:100%; box-sizing:border-box; line-height:1.35!important; height:auto; min-height:34px; padding-top:7px!important; padding-bottom:7px!important; } table select{ padding-right:28px!important; } .card,.dialog,.panel{ overflow-wrap:normal; } .decimal-entry{ font-variant-numeric:tabular-nums; } #orderModal .roll-chip input{ min-width:0!important; width:100%!important; font-family:"Segoe UI",Arial,Helvetica,sans-serif!important; } #orderModal .fabric-item-main-grid .f-price{ font-variant-numeric:tabular-nums; } /* Các bảng rộng được cuộn ngang thay vì ép cột đến mức mất chữ */ .card:has(> table), .accessory-order-list-wrap, .accessory-issue-list-wrap, .inventory-matrix-wrap, .product-cost-table-wrap{ overflow-x:auto!important; } /* Giữ nội dung trong các nút không bị mất chữ */ .btn,button{ line-height:1.25!important; min-height:32px; white-space:nowrap; } /* V3.37.1 Stable - sửa hiển thị bảng đơn phụ liệu, bỏ Ghi chú, căn giữa */ #accessoryOrderModal .accessory-order-editor-table{ overflow-x:auto!important; } #accessoryOrderModal .accessory-order-table-head, #accessoryOrderModal .accessory-order-table-row{ display:grid!important; grid-template-columns: 50px minmax(240px,1.55fr) minmax(130px,.75fr) minmax(300px,1.9fr) minmax(140px,.85fr) minmax(140px,.85fr) minmax(180px,1.05fr) minmax(160px,.95fr) 90px!important; min-width:1450px; align-items:stretch!important; } #accessoryOrderModal .accessory-order-table-head>div, #accessoryOrderModal .ao-cell{ display:flex!important; align-items:center!important; justify-content:center!important; text-align:center!important; min-width:0!important; width:100%!important; box-sizing:border-box!important; padding:8px 7px!important; overflow:visible!important; white-space:normal!important; line-height:1.35!important; } #accessoryOrderModal .accessory-order-table-head>div{ font-weight:800!important; } #accessoryOrderModal .ao-cell input, #accessoryOrderModal .ao-cell select, #accessoryOrderModal .ao-cell textarea{ width:100%!important; min-width:0!important; max-width:100%!important; box-sizing:border-box!important; text-align:center!important; overflow:visible!important; text-overflow:clip!important; white-space:normal!important; } #accessoryOrderModal .ao-cell select{ padding-left:8px!important; padding-right:28px!important; } #accessoryOrderModal .ao-product-cell, #accessoryOrderModal .ao-class-cell, #accessoryOrderModal .ao-convert-cell{ white-space:normal!important; overflow-wrap:anywhere!important; } #accessoryOrderModal .ao-product-cell select{ min-width:220px!important; } #accessoryOrderModal .ao-class-cell{ min-width:300px!important; } #accessoryOrderModal .accessory-order-colors{ width:100%!important; display:flex!important; flex-wrap:wrap!important; align-items:center!important; justify-content:center!important; gap:6px!important; } #accessoryOrderModal .accessory-order-color-input{ min-width:72px!important; max-width:92px!important; } #accessoryOrderModal .ao-convert-cell{ min-width:180px!important; } #accessoryOrderModal .ao-action-cell{ justify-content:center!important; } #accessoryOrderModal .ao-action-cell .btn{ min-width:58px!important; } #accessoryOrderModal .accessory-order-list-footer{ text-align:center!important; } #accessoryOrderModal .accessory-order-list-footer>*{ text-align:center!important; } /* Căn giữa tiêu đề + dữ liệu cho toàn bộ bảng hệ thống */ table th, table td{ text-align:center!important; vertical-align:middle!important; } table td.money, table th.money{ text-align:center!important; } table .nowrap{ text-align:center!important; } table input, table select, table textarea{ text-align:center!important; } /* Tránh thiếu chữ trong tất cả bảng */ table th, table td{ overflow:visible!important; text-overflow:clip!important; white-space:normal!important; line-height:1.4!important; } table{ table-layout:auto!important; } /* V3.37.1 Stable - FIX dứt điểm bảng Tạo/Sửa đơn phụ liệu */ #accessoryOrderModal .accessory-order-editor-dialog{ width:min(99vw,1660px)!important; max-width:1660px!important; } #accessoryOrderModal .accessory-order-editor-table{ width:calc(100% - 32px)!important; margin:0 16px!important; overflow-x:auto!important; overflow-y:visible!important; border:1px solid #d6dce5!important; border-radius:10px!important; background:#fff!important; } #accessoryOrderModal .accessory-order-table-head, #accessoryOrderModal .accessory-order-table-row{ display:grid!important; grid-template-columns: 52px minmax(245px,1.5fr) 135px minmax(350px,2.2fr) 155px 145px minmax(205px,1.15fr) 165px 92px!important; min-width:1580px!important; width:100%!important; box-sizing:border-box!important; align-items:stretch!important; } #accessoryOrderModal .accessory-order-table-head{ background:#f7f8fa!important; border-bottom:1px solid #d9dee7!important; } #accessoryOrderModal .accessory-order-table-head>div{ display:flex!important; align-items:center!important; justify-content:center!important; padding:12px 8px!important; min-width:0!important; text-align:center!important; white-space:normal!important; line-height:1.3!important; font-size:12px!important; font-weight:800!important; color:#344054!important; } #accessoryOrderModal .accessory-order-table-row{ position:relative!important; min-height:88px!important; border-bottom:1px solid #e4e7ec!important; background:#fff!important; } #accessoryOrderModal .accessory-order-table-row:last-child{ border-bottom:0!important; } #accessoryOrderModal .ao-cell{ display:flex!important; flex-direction:column!important; align-items:center!important; justify-content:center!important; gap:5px!important; padding:10px 8px!important; min-width:0!important; width:100%!important; box-sizing:border-box!important; overflow:visible!important; text-align:center!important; white-space:normal!important; line-height:1.35!important; } #accessoryOrderModal .ao-cell input, #accessoryOrderModal .ao-cell select{ width:100%!important; max-width:100%!important; min-width:0!important; height:38px!important; min-height:38px!important; box-sizing:border-box!important; padding:7px 28px 7px 9px!important; text-align:center!important; font-size:13px!important; line-height:1.25!important; } #accessoryOrderModal .ao-cell input{ padding-right:9px!important; } #accessoryOrderModal .ao-stt{ font-weight:850!important; } #accessoryOrderModal .ao-product-cell{ padding-left:10px!important; padding-right:10px!important; } #accessoryOrderModal .ao-product{ font-weight:700!important; } #accessoryOrderModal .ao-unit-cell{ display:flex!important; flex-direction:column!important; justify-content:center!important; } #accessoryOrderModal .ao-unit-cell .ao-base-preview{ width:100%!important; margin-top:2px!important; font-size:10.5px!important; line-height:1.25!important; white-space:normal!important; overflow-wrap:anywhere!important; text-align:center!important; } #accessoryOrderModal .ao-class-cell{ min-width:0!important; padding-left:10px!important; padding-right:10px!important; } #accessoryOrderModal .accessory-order-colors{ width:100%!important; display:grid!important; grid-template-columns:repeat(auto-fit,minmax(58px,1fr))!important; gap:7px!important; align-items:end!important; justify-items:stretch!important; overflow:visible!important; } #accessoryOrderModal .accessory-order-color-row{ min-width:0!important; width:100%!important; display:flex!important; flex-direction:column!important; align-items:stretch!important; justify-content:flex-end!important; padding:0!important; border:0!important; background:transparent!important; } #accessoryOrderModal .ao-class-label{ min-height:16px!important; margin:0 0 4px!important; text-align:center!important; font-size:10.5px!important; font-weight:800!important; white-space:normal!important; line-height:1.15!important; overflow-wrap:anywhere!important; } #accessoryOrderModal .accessory-order-color-row .ao-color-qty{ width:100%!important; min-width:0!important; height:36px!important; text-align:center!important; padding:6px!important; } #accessoryOrderModal .accessory-no-color-label{ width:100%!important; text-align:center!important; white-space:normal!important; line-height:1.3!important; } #accessoryOrderModal .ao-qty-with-unit{ width:100%!important; display:flex!important; align-items:center!important; justify-content:center!important; gap:6px!important; } #accessoryOrderModal .ao-qty-with-unit input{ flex:1 1 auto!important; min-width:0!important; } #accessoryOrderModal .ao-purchase-unit-label{ flex:0 0 auto!important; font-size:11px!important; white-space:nowrap!important; } #accessoryOrderModal .ao-class-total{ width:100%!important; font-size:10.5px!important; line-height:1.2!important; white-space:normal!important; text-align:center!important; } #accessoryOrderModal .ao-price-cell input{ font-variant-numeric:tabular-nums!important; font-weight:700!important; } #accessoryOrderModal .ao-convert-cell{ min-width:0!important; font-size:11.5px!important; line-height:1.35!important; white-space:normal!important; overflow-wrap:anywhere!important; text-align:center!important; } #accessoryOrderModal .ao-conversion-display{ width:100%!important; text-align:center!important; } #accessoryOrderModal .ao-total-cell{ font-size:13px!important; font-weight:800!important; white-space:normal!important; overflow-wrap:anywhere!important; } #accessoryOrderModal .ao-action-cell{ display:flex!important; align-items:center!important; justify-content:center!important; } #accessoryOrderModal .ao-action-cell .btn{ width:auto!important; min-width:62px!important; padding:7px 10px!important; } #accessoryOrderModal .ao-import-fees{ grid-column:1 / -1!important; width:100%!important; box-sizing:border-box!important; display:grid!important; grid-template-columns:repeat(4,minmax(180px,1fr))!important; gap:12px!important; padding:10px 16px 12px!important; border-top:1px dashed #d9dee7!important; background:#fbfcfe!important; } #accessoryOrderModal .ao-import-fees>div{ display:grid!important; grid-template-columns:auto minmax(0,1fr)!important; align-items:center!important; gap:8px!important; min-width:0!important; font-size:11px!important; font-weight:700!important; } #accessoryOrderModal .ao-import-fees input{ width:100%!important; min-width:0!important; height:34px!important; text-align:center!important; } #accessoryOrderModal .accessory-order-list-footer{ min-width:1580px!important; width:100%!important; box-sizing:border-box!important; display:flex!important; align-items:center!important; justify-content:space-between!important; padding:11px 18px!important; font-size:13px!important; } #accessoryOrderModal .accessory-order-list-footer strong{ font-size:14px!important; } #accessoryOrderModal #accessoryOrderListTotal{ font-size:18px!important; font-weight:900!important; } /* Căn giữa bảng toàn hệ thống, nhưng không ép các đoạn văn/ghi chú */ table th, table td{ text-align:center!important; vertical-align:middle!important; } table th{ white-space:normal!important; } table td{ white-space:normal!important; } table td.money, table th.money{ text-align:center!important; white-space:nowrap!important; } table input, table select{ text-align:center!important; } /* Không để chữ bị cắt trong bảng */ table th, table td{ overflow:visible!important; text-overflow:clip!important; line-height:1.4!important; } @media(max-width:1100px){ #accessoryOrderModal .ao-import-fees{ grid-template-columns:repeat(2,minmax(180px,1fr))!important; } } /* V3.37.1 Stable - đơn phụ liệu trong nước không có chi phí nhập khẩu */ #accessoryOrderModal .accessory-import-costs.domestic-hidden{ display:none!important; } /* V3.37.1 Stable - hiển thị đầy đủ Tên sản phẩm vải trong đơn đặt vải */ #orderModal .fabric-item-main-grid{ grid-template-columns:minmax(420px,1.7fr) minmax(230px,.8fr)!important; align-items:end!important; } #orderModal .fabric-item-main-grid .field{ min-width:0!important; } #orderModal .f-product{ width:100%!important; min-width:0!important; height:42px!important; min-height:42px!important; padding:8px 38px 8px 12px!important; font-size:13px!important; line-height:1.35!important; font-weight:700!important; text-overflow:clip!important; white-space:nowrap!important; overflow:visible!important; box-sizing:border-box!important; } #orderModal .fabric-item-main-grid .f-price{ height:42px!important; min-height:42px!important; } @media(max-width:850px){ #orderModal .fabric-item-main-grid{ grid-template-columns:1fr!important; } } /* V3.37.1 Stable - chưa chọn màu thì ô màu để trống */ #orderModal .fabric-color-swatch.empty-color-swatch{ background:transparent!important; border:1px solid #d7dce5!important; box-shadow:none!important; } /* V3.37.1 Stable - giá vốn bình quân theo từng loại vải */ #orderModal .fabric-order-summary-cards{ grid-template-columns:repeat(6,minmax(0,1fr))!important; } #orderModal .fabric-item-total{ display:flex!important; align-items:center!important; justify-content:space-between!important; gap:14px!important; flex-wrap:wrap!important; } #orderModal .fabric-item-average-cost{ margin-left:auto; padding-left:14px; border-left:1px solid #b9d6ff; color:#1559c7!important; white-space:nowrap!important; } @media(max-width:1200px){ #orderModal .fabric-order-summary-cards{grid-template-columns:repeat(3,minmax(0,1fr))!important} } @media(max-width:700px){ #orderModal .fabric-order-summary-cards{grid-template-columns:1fr!important} #orderModal .fabric-item-average-cost{margin-left:0;padding-left:0;border-left:0} } /* V3.37.1 Stable - ô Danh sách phụ liệu dạng đen mờ giống danh sách sản phẩm vải */ #accessoryOrderModal .ao-cell input, #accessoryOrderModal .ao-cell select{ background:#f3f4f6!important; border:1px solid #d7dbe2!important; color:#20242b!important; box-shadow:none!important; } #accessoryOrderModal .ao-cell input::placeholder{ color:#8b929d!important; opacity:1; } #accessoryOrderModal .ao-cell input:focus, #accessoryOrderModal .ao-cell select:focus{ background:#eef0f3!important; border-color:#aeb5bf!important; outline:none!important; box-shadow:0 0 0 2px rgba(17,24,39,.05)!important; } #accessoryOrderModal .accessory-order-color-row .ao-color-qty{ background:#f3f4f6!important; border:1px solid #d7dbe2!important; color:#20242b!important; } #accessoryOrderModal .ao-import-fees input{ background:#f3f4f6!important; border:1px solid #d7dbe2!important; color:#20242b!important; } #accessoryOrderModal .ao-base-preview, #accessoryOrderModal .ao-class-total, #accessoryOrderModal .ao-conversion-display{ color:#555e6b!important; } /* V3.37.1 Stable - Giá vốn trung bình trong Chi tiết từng loại vải */ #detailModal table th:last-child, #detailModal table td:last-child{ min-width:145px; } /* V3.37.1 Stable - Bảng số liệu vải về: 10 cột cây bằng nhau */ #detailModal .order-arrival-table{ table-layout:fixed!important; width:100%!important; min-width:1180px!important; } #detailModal .order-arrival-table .fabric-name{ width:220px!important; min-width:220px!important; max-width:220px!important; } #detailModal .order-arrival-table .total-col{ width:90px!important; min-width:90px!important; max-width:90px!important; } #detailModal .order-arrival-table .roll-col{ width:78px!important; min-width:78px!important; max-width:78px!important; box-sizing:border-box!important; text-align:center!important; padding-left:5px!important; padding-right:5px!important; } #detailModal .order-arrival-table th.roll-col, #detailModal .order-arrival-table td.roll-col{ width:78px!important; min-width:78px!important; max-width:78px!important; } /* V3.37.1 Stable - responsive toàn hệ thống */ :root{--sidebar-width:245px} html,body{max-width:100%;overflow-x:hidden} .app{display:grid!important;grid-template-columns:var(--sidebar-width) minmax(0,1fr)!important;width:100%!important;min-height:100vh!important} .sidebar{width:var(--sidebar-width)!important;box-sizing:border-box!important;overflow-y:auto!important;overflow-x:hidden!important;padding-bottom:40px!important} .sidebar-bottom{position:relative!important;left:auto!important;right:auto!important;bottom:auto!important;margin:22px 8px 0!important} .main,.panel,.card{min-width:0!important;max-width:100%;box-sizing:border-box} .top>div:first-child,.toolbar,.toolbar .left,.toolbar .right{min-width:0} .panel>.card,.card:has(table),.inventory-matrix-wrap,.product-cost-table-wrap,.accessory-order-list-wrap,.accessory-issue-list-wrap,.factory-accessory-detail-table-wrap{overflow-x:auto!important;-webkit-overflow-scrolling:touch} .dialog{max-width:calc(100vw - 24px)!important;max-height:calc(100vh - 24px)!important;box-sizing:border-box!important} .form-grid,.fabric-order-info-grid,.accessory-order-info-grid{grid-template-columns:repeat(4,minmax(0,1fr))} .field{min-width:0}.field input,.field select,.field textarea{width:100%;max-width:100%;box-sizing:border-box} .stats{grid-template-columns:repeat(4,minmax(0,1fr))} .mobile-menu-toggle,.sidebar-mobile-close,.mobile-sidebar-backdrop{display:none}.sidebar-mobile-head{display:block} @media(max-width:1366px){ :root{--sidebar-width:220px}.sidebar{padding-left:12px!important;padding-right:12px!important}.main{padding:20px!important} .nav button{font-size:12.5px!important;padding-top:10px!important;padding-bottom:10px!important}.top h1{font-size:23px!important}.stat .value{font-size:19px!important} } @media(max-width:900px){ .app{display:block!important}.sidebar{position:fixed!important;z-index:1000!important;top:0!important;bottom:0!important;left:0!important;width:min(86vw,300px)!important;height:calc(var(--app-vh,1vh)*100)!important;transform:translateX(-105%);transition:transform .22s ease;box-shadow:12px 0 30px rgba(0,0,0,.18);padding:16px 12px 32px!important} body.mobile-sidebar-open .sidebar{transform:translateX(0)}body.mobile-sidebar-open{overflow:hidden} .sidebar-mobile-head{display:flex!important;align-items:center;justify-content:space-between}.sidebar-mobile-close{display:inline-flex!important;align-items:center;justify-content:center;border:1px solid #333;background:#1e1e1e;color:#fff;border-radius:8px;width:36px;height:36px} .mobile-menu-toggle{display:flex!important;position:sticky!important;top:8px;z-index:120!important;align-items:center;justify-content:center;width:42px;height:42px;margin:0 0 12px!important;border:1px solid var(--line);border-radius:9px;background:#fff;font-size:21px} .mobile-sidebar-backdrop{display:none;position:fixed;inset:0;background:rgba(0,0,0,.38);z-index:999}body.mobile-sidebar-open .mobile-sidebar-backdrop{display:block} .main{padding:12px!important;width:100%!important}.top{align-items:flex-start!important;flex-wrap:wrap!important}.top h1{font-size:21px!important} .stats{grid-template-columns:repeat(2,minmax(0,1fr))!important}.toolbar .left,.toolbar .right{width:100%!important}.toolbar input,.toolbar select{flex:1 1 180px!important;min-width:0!important} .form-grid,.fabric-order-info-grid,.accessory-order-info-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}.span4{grid-column:1/-1!important} .dialog{width:calc(100vw - 16px)!important;max-width:calc(100vw - 16px)!important;max-height:calc(var(--app-vh,1vh)*100 - 16px)!important}.modal{padding:8px!important} .summary-box{grid-template-columns:repeat(2,minmax(0,1fr))!important} } @media(max-width:600px){ .main{padding:9px!important}.top h1{font-size:19px!important}.small{font-size:11px!important}.stats{grid-template-columns:1fr 1fr!important;gap:7px!important}.stats .card{padding:10px!important}.stat .value{font-size:16px!important} .card{padding:10px!important}.toolbar input,.toolbar select,.toolbar .btn{width:100%!important;flex:1 1 100%!important} .form-grid,.fabric-order-info-grid,.accessory-order-info-grid{grid-template-columns:1fr!important}.span2,.span4{grid-column:1!important} .dialog{padding:12px!important}.dialog-head h2{font-size:18px!important}.actions{flex-wrap:wrap!important}.btn{padding:8px 10px!important;font-size:12px!important} table{font-size:11px!important}table th,table td{padding:7px 6px!important}.summary-box{grid-template-columns:1fr!important} .fabric-order-editor-footer,.accessory-order-editor-footer{flex-direction:column!important;align-items:stretch!important}.fabric-order-footer-actions,.accessory-order-footer-actions{width:100%!important;display:grid!important;grid-template-columns:1fr 1fr!important} } @media(max-width:390px){.stats{grid-template-columns:1fr!important}.main{padding:7px!important}.sidebar{width:90vw!important}} /* V3.37.1 Stable - Công nợ gia công xưởng sản xuất */ #factoryStats{grid-template-columns:repeat(4,minmax(0,1fr))} .factory-debt-highlight{border-color:#ef9a9a!important;background:#fff8f8!important} .factory-debt-highlight .value{color:#b42318!important} #factoryDebtModal .factory-debt-dialog{width:min(97vw,1500px)!important;max-width:1500px!important} #factoryPaymentModal .factory-payment-dialog{width:min(96vw,1200px)!important;max-width:1200px!important} #factoryDebtTable table,#factoryPaymentHistory table{min-width:1100px} #factoryPaymentBatchList{overflow-x:auto} #factoryPaymentBatchList table{min-width:850px} #factoryPaymentBatchList .factory-payment-check{width:18px;height:18px;accent-color:#111} .factory-payment-summary{grid-template-columns:repeat(4,minmax(0,1fr));margin-top:16px} @media(max-width:900px){#factoryStats,.factory-payment-summary{grid-template-columns:repeat(2,minmax(0,1fr))}} @media(max-width:600px){#factoryStats,.factory-payment-summary{grid-template-columns:1fr!important}} /* V3.37.1 Stable - công nợ xưởng phát sinh ngay khi trả hàng */ #factoryDebtTable table{min-width:1250px!important} /* V3.37.1 Stable - định mức vải hỗ trợ dấu phẩy thập phân */ #finishedProductConsumption, #productionConsumption{ font-variant-numeric:tabular-nums; } /* V3.37.1 Stable - Tổng số lượng mỗi lần xưởng trả */ #productionDetailModal table th, #productionDetailModal table td{text-align:center!important;vertical-align:middle!important} /* V3.37.1 Stable - khi sửa thành phẩm chỉ hiển thị form sửa */ #finishedProductModal #finishedProductList[style*="display: none"]{margin:0!important;padding:0!important} /* V3.37.1 Stable - đổi Dashboard thành TỔNG QUAN và in đậm */ .dashboard-menu-button{ font-weight:900!important; } #dashboard h1{ font-weight:900!important; } /* V3.37.1 Stable - Thuế XNK gồm % và số tiền */ #orderModal .fabric-costs{ grid-template-columns:repeat(6,minmax(0,1fr))!important; } #orderModal .f-import-tax-rate, #orderModal .f-import-tax{ text-align:right!important; font-variant-numeric:tabular-nums; } @media(max-width:1200px){ #orderModal .fabric-costs{grid-template-columns:repeat(3,minmax(0,1fr))!important} } @media(max-width:700px){ #orderModal .fabric-costs{grid-template-columns:1fr!important} } /* V3.37.1 Stable */ #orderModal .fabric-costs{grid-template-columns:repeat(5,minmax(0,1fr))!important} #orderModal .fabric-actual-cost-row{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:0 12px 8px;padding:9px 10px;border:1px solid #b9d6ff;border-radius:7px;background:#f7fbff} #orderModal .fabric-actual-cost-input{display:flex;align-items:center;gap:7px}.fabric-actual-cost-input input{width:150px!important;text-align:right!important} #orderModal .fabric-item-actual-payable{margin-left:auto;padding-left:14px;border-left:1px solid #b9d6ff;color:#0f6b3d!important;white-space:nowrap!important} #orderModal .fabric-order-summary-cards{grid-template-columns:repeat(4,minmax(0,1fr))!important} #orderModal .fabric-order-actual-total-card{border-color:#8bc5a6!important;background:#f4fbf7!important}.fabric-order-actual-total-card .value{color:#0f6b3d!important} #orderModal .fabric-order-vat-input{display:flex;align-items:center;justify-content:center;gap:6px;margin:5px 0}.fabric-order-vat-input input{width:90px!important;text-align:center!important} #orderModal .fabric-order-invoice-total-card{border-color:#8bb4ff!important;background:#f5f9ff!important}.fabric-order-invoice-total-card .value{color:#1559c7!important} @media(max-width:1200px){#orderModal .fabric-costs{grid-template-columns:repeat(3,minmax(0,1fr))!important}#orderModal .fabric-order-summary-cards{grid-template-columns:repeat(2,minmax(0,1fr))!important}} @media(max-width:700px){#orderModal .fabric-costs,#orderModal .fabric-order-summary-cards{grid-template-columns:1fr!important}#orderModal .fabric-actual-cost-row{flex-direction:column;align-items:stretch}} /* V3.37.1 Stable - Giá thực tế khi xuất hóa đơn */ #orderModal .fabric-item-actual-payable .small{display:block;margin-top:2px;font-weight:500;color:#5d6a64!important} /* V3.37.1 Stable - Thanh toán tiền tệ độc lập */ #foreignCurrencyPaymentStats{grid-template-columns:repeat(4,minmax(0,1fr))} .foreign-currency-amount{display:flex;align-items:center;gap:8px}.foreign-currency-amount input{flex:1;min-width:0}.foreign-currency-amount strong{min-width:42px;text-align:center} #foreignCurrencyPaymentsTable table{min-width:1200px} @media(max-width:900px){#foreignCurrencyPaymentStats{grid-template-columns:repeat(2,minmax(0,1fr))}} @media(max-width:600px){#foreignCurrencyPaymentStats{grid-template-columns:1fr!important}} /* V3.37.1 Stable - phí phải trả đơn vị vận chuyển trong Tổng hợp tài chính */ #detailModal .kv span:first-child{overflow-wrap:anywhere} /* V3.37.1 Stable - gộp thanh toán nhiều đơn ngoại tệ */ #bulkForeignCurrencyPaymentModal .foreign-bulk-payment-dialog{width:min(97vw,1400px)!important;max-width:1400px!important} #bulkForeignCurrencyOrders{overflow-x:auto} #bulkForeignCurrencyOrders table{min-width:1100px} #bulkForeignCurrencyOrders .bulk-foreign-check{width:18px;height:18px} #bulkForeignCurrencyOrders .bulk-foreign-amount{width:150px!important;text-align:center!important} #bulkForeignCurrencySummary{grid-template-columns:repeat(2,minmax(0,1fr));margin-top:14px} /* V3.37.1 Stable - Chi tiết từng loại vải */ #detailModal table td[data-price] .small{white-space:normal!important;font-weight:500} /* V3.37.1 Stable - Giá vốn vải dùng Giá thực tế khi xuất hóa đơn làm nguồn chuẩn */ .fabric-actual-cost-source-note{font-size:11px;color:#667085} /* V3.37.1 Stable - bộ lọc ngày dùng chung toàn hệ thống */ .roway-date-filter{ margin:0 0 14px; padding:10px 12px; border:1px solid var(--line); border-radius:10px; background:#fff; display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; } .roway-date-filter-title{ display:flex; align-items:center; gap:10px; min-width:180px; } .roway-date-filter-presets{ display:flex; gap:6px; flex-wrap:wrap; align-items:center; } .roway-date-filter-custom{ display:flex; gap:8px; align-items:center; flex-wrap:wrap; } .roway-date-filter-custom label{ display:flex; align-items:center; gap:5px; font-size:11px; font-weight:700; color:#566176; } .roway-date-filter-custom input{ height:32px; padding:5px 8px; border:1px solid var(--line); border-radius:7px; background:#fff; } .roway-date-filter .date-filter-active{ background:#111!important; color:#fff!important; border-color:#111!important; } @media(max-width:900px){ .roway-date-filter{align-items:flex-start} .roway-date-filter-title,.roway-date-filter-presets,.roway-date-filter-custom{width:100%} } @media(max-width:600px){ .roway-date-filter-presets{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:100%} .roway-date-filter-presets .btn{width:100%!important} .roway-date-filter-custom{display:grid;grid-template-columns:1fr 1fr;width:100%} .roway-date-filter-custom label{display:block} .roway-date-filter-custom input{width:100%;margin-top:4px} .roway-date-filter-custom .roway-date-apply{grid-column:1/-1;width:100%!important} } /* V3.37.1 Stable - bỏ Báo cáo tồn kho sản xuất khỏi hệ thống */ #productionInventoryValueReport{display:none!important} /* Khóa cuộn nền khi đang thao tác popup/modal. Chỉ vùng nội dung popup được cuộn, trang danh mục phía sau không cuộn theo. */ body.roway-modal-scroll-lock{ overflow:hidden!important; overscroll-behavior:none!important; } body.roway-modal-scroll-lock .main{ overscroll-behavior:none!important; } .modal.open{ overscroll-behavior:contain!important; } .modal.open .dialog{ overscroll-behavior:contain!important; -webkit-overflow-scrolling:touch; } /* V3.37.1 Stable - các danh mục tĩnh không dùng bộ lọc ngày */ /* V3.37.1 Stable - menu trái độc lập hoàn toàn với cuộn trang dữ liệu */ @media(min-width:901px){ html,body{ height:100%!important; overflow:hidden!important; } .app{ height:100vh!important; min-height:100vh!important; overflow:hidden!important; align-items:stretch!important; } .sidebar{ position:sticky!important; top:0!important; height:100vh!important; max-height:100vh!important; overflow-y:auto!important; overflow-x:hidden!important; overscroll-behavior:contain!important; scrollbar-gutter:stable; } .main{ height:100vh!important; max-height:100vh!important; overflow-y:auto!important; overflow-x:hidden!important; overscroll-behavior:contain!important; -webkit-overflow-scrolling:touch; } } /* Khi con trỏ đang ở bảng rộng, cuộn dọc chỉ tác động vùng nội dung chính */ .main, .main .panel, .main .card{ overscroll-behavior-y:contain!important; } /* Menu tự có vùng cuộn riêng nếu chiều cao màn hình không đủ */ .sidebar{ overscroll-behavior:contain!important; } /* V3.37.1 Stable - lăn chuột ở bất kỳ vị trí nào trong vùng dữ liệu */ @media(min-width:901px){ .main{ overflow-y:auto!important; overflow-x:hidden!important; scroll-behavior:auto!important; overscroll-behavior-y:contain!important; } .main .panel{ min-height:100%; overflow:visible!important; } .main .card{ overscroll-behavior:contain!important; } } /* V3.37.1 Stable - màn hình đăng nhập luôn phủ toàn bộ hệ thống khi đăng xuất */ #loginOverlay.login-overlay{ position:fixed!important; inset:0!important; width:100vw!important; height:100vh!important; z-index:2147483000!important; display:flex; align-items:center!important; justify-content:center!important; background:#111!important; opacity:1!important; visibility:visible; pointer-events:auto!important; overflow:auto!important; } body.logged-out{ overflow:hidden!important; } body.logged-out .app{ pointer-events:none!important; user-select:none!important; } body.logged-out #loginOverlay{ pointer-events:auto!important; user-select:auto!important; } /* V3.37.1 Stable - Tạo phiếu xuất phụ liệu sản xuất: viền ô Phụ liệu xuất đen mờ */ #accessoryIssueModal .accessory-issue-item, #accessoryIssueModal .accessory-issue-row, #accessoryIssueModal .accessory-issue-grid > *, #accessoryIssueModal .accessory-issue-item input, #accessoryIssueModal .accessory-issue-item select, #accessoryIssueModal .accessory-issue-row input, #accessoryIssueModal .accessory-issue-row select{ border-color:rgba(17,24,39,.28)!important; } #accessoryIssueModal .accessory-issue-item, #accessoryIssueModal .accessory-issue-row{ box-shadow:inset 0 0 0 1px rgba(17,24,39,.08)!important; } #accessoryIssueModal .accessory-issue-item input, #accessoryIssueModal .accessory-issue-item select, #accessoryIssueModal .accessory-issue-row input, #accessoryIssueModal .accessory-issue-row select{ background:#f7f7f8!important; color:#20242b!important; } #accessoryIssueModal .accessory-issue-item input:focus, #accessoryIssueModal .accessory-issue-item select:focus, #accessoryIssueModal .accessory-issue-row input:focus, #accessoryIssueModal .accessory-issue-row select:focus{ border-color:rgba(17,24,39,.5)!important; box-shadow:0 0 0 2px rgba(17,24,39,.05)!important; outline:none!important; } /* V3.37.1 Stable - quyền thao tác chi tiết theo từng danh mục */ .user-action-permission-card{margin-top:14px} .user-action-permission-card .permission-group-title{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:10px!important} .user-action-permission-card .action-group-btn{padding:5px 8px!important;font-size:10px!important;min-height:26px!important} #userActionPermissionGrid{display:grid;gap:12px} @media(max-width:700px){.user-action-permission-card .permission-group-title{align-items:flex-start!important;flex-direction:column!important}} /* V3.37.1 Stable - input ngày mở lịch + hoạt động Tổng quan */ input[type="date"]{ cursor:pointer!important; caret-color:transparent; } input[type="date"]::-webkit-calendar-picker-indicator{ cursor:pointer!important; opacity:.9; } .dashboard-activity-card{overflow:visible!important} .dashboard-activity-filter{ display:grid; gap:10px; margin-bottom:14px; padding-bottom:12px; border-bottom:1px solid var(--line); } .dashboard-activity-presets,.dashboard-activity-custom{ display:flex; align-items:center; gap:7px; flex-wrap:wrap; } .dashboard-activity-custom label{ display:flex; align-items:center; gap:6px; font-size:11px; font-weight:700; color:#566176; } .dashboard-activity-custom input[type="date"]{ height:34px; border:1px solid var(--line); border-radius:7px; padding:5px 8px; background:#fff; } .dashboard-activity-or{font-size:11px;color:var(--muted);font-weight:700} .dashboard-activity-presets .date-filter-active{ background:#111!important;color:#fff!important;border-color:#111!important; } .dashboard-activity-stats{grid-template-columns:repeat(4,minmax(0,1fr))!important} #dashboardActivityTable{overflow-x:auto} #dashboardActivityTable table{min-width:760px} @media(max-width:900px){ .dashboard-activity-stats{grid-template-columns:repeat(2,minmax(0,1fr))!important} .dashboard-activity-custom{align-items:flex-end} } @media(max-width:600px){ .dashboard-activity-presets{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))} .dashboard-activity-presets .btn{width:100%!important} .dashboard-activity-custom{display:grid;grid-template-columns:1fr 1fr;width:100%} .dashboard-activity-custom label{display:block} .dashboard-activity-custom input{width:100%;margin-top:4px} .dashboard-activity-or{display:none} .dashboard-activity-custom .btn{grid-column:1/-1;width:100%!important} .dashboard-activity-stats{grid-template-columns:1fr!important} } /* V3.37.1 Stable - đăng xuất luôn trở về màn hình đăng nhập */ html.logged-out-root, html.logged-out-root body{ overflow:hidden!important; } body.logged-out #loginOverlay, #loginOverlay.login-force-visible{ display:flex!important; position:fixed!important; inset:0!important; width:100vw!important; height:100vh!important; min-width:100vw!important; min-height:100vh!important; z-index:2147483647!important; visibility:visible!important; opacity:1!important; pointer-events:auto!important; background:#111!important; align-items:center!important; justify-content:center!important; margin:0!important; transform:none!important; } body.logged-out .app{ filter:none!important; } /* V3.37.1 Stable - đăng xuất reload sạch và bắt buộc về màn hình đăng nhập */ html.logged-out-root body > #loginOverlay, body.logged-out > #loginOverlay{ display:flex!important; position:fixed!important; inset:0!important; width:100vw!important; height:100vh!important; z-index:2147483647!important; visibility:visible!important; opacity:1!important; pointer-events:auto!important; background:#111!important; } /* V3.37.1 Stable - PIN đăng nhập không định dạng số + nút xem PIN */ .login-pin-field{ display:flex; align-items:center; position:relative; } .login-pin-field #loginPin{ width:100%; padding-right:44px!important; letter-spacing:.08em; } .login-pin-field .pin-eye{ position:absolute; right:6px; top:50%; transform:translateY(-50%); width:34px; height:34px; border:0; background:transparent; cursor:pointer; font-size:16px; border-radius:7px; } .login-pin-field .pin-eye:hover{background:#f1f1f1} /* V3.37.1 Stable - đăng xuất ẩn hoàn toàn dữ liệu, chỉ hiện màn hình đăng nhập */ body.logged-out .app, html.logged-out-root body .app{ display:none!important; visibility:hidden!important; opacity:0!important; pointer-events:none!important; } body.logged-out #loginOverlay, html.logged-out-root body #loginOverlay{ display:flex!important; position:fixed!important; inset:0!important; width:100vw!important; height:100vh!important; z-index:2147483647!important; visibility:visible!important; opacity:1!important; pointer-events:auto!important; background:#111!important; } /* V3.37.1 Stable - #login là trạng thái đăng xuất bắt buộc */ html.logged-out-root body .app, body.logged-out .app{ display:none!important; visibility:hidden!important; opacity:0!important; pointer-events:none!important; } html.logged-out-root body #loginOverlay, body.logged-out #loginOverlay{ display:flex!important; visibility:visible!important; opacity:1!important; pointer-events:auto!important; z-index:2147483647!important; } /* V3.37.1 Stable - Data Safety + Responsive hardening */ .data-integrity-status{ margin:10px 0 14px;padding:10px 12px;border:1px solid var(--line);border-radius:9px;background:#f7f8fa;font-size:12px; } .data-integrity-status.integrity-ok{border-color:#95c8a7;background:#f3fbf6;color:#176b3a} .data-integrity-status.integrity-warning{border-color:#e7c66c;background:#fffaf0;color:#805b00} .data-integrity-status.integrity-error{border-color:#e4a0a0;background:#fff5f5;color:#a11b1b} /* Mọi vùng bảng rộng đều cuộn ngang riêng, không phá layout. */ .main table{max-width:none} .main .card>div[style*="overflow:auto"], .inventory-matrix-wrap,.accessory-order-list-wrap,.accessory-issue-list-wrap, .factory-accessory-detail-table-wrap,.product-cost-table-wrap{ max-width:100%!important; overflow-x:auto!important; -webkit-overflow-scrolling:touch; } /* Laptop 1366: giảm khoảng trống nhưng không ép chữ. */ @media (min-width:901px) and (max-width:1366px){ .main{padding:16px!important} .card{padding:12px!important} .top h1{font-size:21px!important} table th,table td{padding:7px 6px!important} } /* Tablet & mobile: touch target và form dễ thao tác. */ @media(max-width:900px){ .dialog{overflow-y:auto!important} .dialog .actions{position:sticky;bottom:-12px;background:#fff;padding-top:10px;padding-bottom:4px;z-index:8} } @media(max-width:600px){ input,select,textarea{font-size:16px!important} .btn,.smallbtn,.pin-eye,.mobile-menu-toggle,.sidebar-mobile-close{ min-height:40px!important; } .btn.smallbtn{padding:7px 9px!important} .dialog{ width:calc(100vw - 8px)!important; max-width:calc(100vw - 8px)!important; max-height:calc(var(--app-vh,1vh)*100 - 8px)!important; margin:0!important; border-radius:10px!important; } .modal{padding:4px!important} .card{overflow-x:auto} table th,table td{white-space:nowrap} .field textarea{min-height:80px} } /* V3.37.1 Stable - bộ lọc ngày thu gọn mặc định */ .roway-date-filter{ margin:0 0 12px!important; padding:0!important; border:0!important; background:transparent!important; display:block!important; } .roway-date-filter-toggle{ display:inline-flex!important; align-items:center!important; gap:7px!important; min-height:32px!important; padding:5px 10px!important; border:1px solid var(--line)!important; border-radius:8px!important; background:#fff!important; color:#20242b!important; cursor:pointer!important; font:inherit!important; font-size:11px!important; font-weight:750!important; box-shadow:0 1px 2px rgba(0,0,0,.03)!important; } .roway-date-filter-toggle:hover{border-color:#9da5b1!important;background:#fafafa!important} .roway-date-filter-toggle-icon{ display:inline-flex; align-items:center; justify-content:center; width:15px; height:15px; font-size:14px; line-height:1; transition:transform .16s ease; } .roway-date-filter:not(.roway-date-filter-collapsed) .roway-date-filter-toggle-icon{transform:rotate(180deg)} .roway-date-filter-current{ display:inline-flex; align-items:center; min-height:20px; padding:2px 7px; border-radius:999px; background:#f0f1f3; color:#545d6b; font-size:10px!important; font-weight:700; white-space:nowrap; } .roway-date-filter-body{ margin-top:7px; width:max-content; max-width:100%; padding:9px 10px; border:1px solid var(--line); border-radius:9px; background:#fff; box-shadow:0 8px 22px rgba(16,24,40,.08); display:flex; align-items:center; gap:8px; flex-wrap:wrap; } .roway-date-filter-collapsed .roway-date-filter-body{display:none!important} .roway-date-filter-presets{display:flex!important;align-items:center!important;gap:5px!important;flex-wrap:wrap!important} .roway-date-filter-custom{display:flex!important;align-items:center!important;gap:6px!important;flex-wrap:wrap!important} .roway-date-filter-custom label{font-size:10px!important;gap:4px!important} .roway-date-filter-custom input{height:30px!important;min-height:30px!important;padding:4px 7px!important;font-size:11px!important} .roway-date-filter-body .btn.smallbtn{min-height:30px!important;padding:5px 8px!important;font-size:10px!important} @media(max-width:900px){ .roway-date-filter-body{width:100%!important} } @media(max-width:600px){ .roway-date-filter{margin-bottom:10px!important} .roway-date-filter-toggle{width:auto!important;max-width:100%!important} .roway-date-filter-body{padding:8px!important} .roway-date-filter-presets{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;width:100%!important} .roway-date-filter-presets .btn{width:100%!important} .roway-date-filter-custom{display:grid!important;grid-template-columns:1fr 1fr!important;width:100%!important} .roway-date-filter-custom label{display:block!important} .roway-date-filter-custom input{width:100%!important;margin-top:4px!important} .roway-date-filter-custom .roway-date-apply{grid-column:1/-1!important;width:100%!important} } /* V3.37.1 Stable - bộ lọc ngày nằm trong thanh công cụ của bảng */ .toolbar .left{ display:flex!important; align-items:center!important; gap:8px!important; flex-wrap:wrap!important; min-width:0!important; } .roway-date-filter-in-toolbar{ position:relative!important; display:inline-flex!important; align-items:center!important; margin:0!important; padding:0!important; flex:0 0 auto!important; z-index:20; } .roway-date-filter-in-toolbar .roway-date-filter-toggle{ height:36px!important; min-height:36px!important; padding:0 10px!important; border-radius:7px!important; white-space:nowrap!important; box-sizing:border-box!important; } .roway-date-filter-in-toolbar .roway-date-filter-body{ position:absolute!important; top:calc(100% + 6px)!important; left:0!important; z-index:1000!important; width:max-content!important; min-width:520px!important; max-width:min(760px,calc(100vw - 40px))!important; margin:0!important; } .roway-date-filter-in-toolbar.roway-date-filter-collapsed .roway-date-filter-body{display:none!important} .roway-generated-toolbar{margin-bottom:10px!important} .card:has(.roway-date-filter-in-toolbar){overflow:visible} @media(max-width:900px){ .toolbar .left{width:100%!important} .roway-date-filter-in-toolbar .roway-date-filter-body{ left:0!important; min-width:min(520px,calc(100vw - 48px))!important; } } @media(max-width:600px){ .toolbar{align-items:stretch!important} .toolbar .left{display:flex!important;align-items:stretch!important} .toolbar .left>input,.toolbar .left>select{flex:1 1 160px!important;min-width:0!important} .roway-date-filter-in-toolbar{flex:0 0 auto!important} .roway-date-filter-in-toolbar .roway-date-filter-toggle{height:40px!important;min-height:40px!important} .roway-date-filter-in-toolbar .roway-date-filter-body{ position:fixed!important; left:8px!important; right:8px!important; top:auto!important; width:auto!important; min-width:0!important; max-width:none!important; margin-top:6px!important; } } /* V3.37.1 Stable - font nút Lọc theo ngày đồng bộ ô tìm kiếm/select bên cạnh */ .roway-date-filter-in-toolbar .roway-date-filter-toggle{ font-family:inherit!important; font-size:12px!important; font-weight:500!important; line-height:1.2!important; letter-spacing:normal!important; color:var(--text)!important; } .roway-date-filter-in-toolbar .roway-date-filter-toggle-text{ font:inherit!important; font-weight:500!important; } .roway-date-filter-in-toolbar .roway-date-filter-current{ font-family:inherit!important; font-size:11px!important; font-weight:500!important; letter-spacing:normal!important; } .roway-date-filter-in-toolbar .roway-date-filter-toggle-icon{ font-family:inherit!important; font-weight:400!important; } /* V3.37.1 Stable - FIX danh mục mobile */ @media(max-width:900px){ html,body{width:100%!important;max-width:100%!important;overflow-x:hidden!important} .app{display:block!important;width:100%!important;min-height:100vh!important} .sidebar{ display:flex!important; flex-direction:column!important; position:fixed!important; top:0!important; left:0!important; bottom:auto!important; width:min(88vw,330px)!important; max-width:330px!important; height:calc(var(--app-vh,1vh)*100)!important; max-height:calc(var(--app-vh,1vh)*100)!important; margin:0!important; padding:14px 10px 12px!important; background:#121212!important; color:#fff!important; z-index:2147483000!important; transform:translate3d(-105%,0,0)!important; transition:transform .2s ease!important; visibility:visible!important; opacity:1!important; overflow:hidden!important; pointer-events:auto!important; box-shadow:12px 0 30px rgba(0,0,0,.22)!important; } body.mobile-sidebar-open .sidebar{ transform:translate3d(0,0,0)!important; } .sidebar-mobile-head{ display:flex!important; flex:0 0 auto!important; align-items:center!important; justify-content:space-between!important; gap:8px!important; padding:0 2px 10px!important; } .sidebar-mobile-head .brand{ margin:0 6px!important; font-size:16px!important; white-space:nowrap!important; overflow:hidden!important; text-overflow:ellipsis!important; } .sidebar-mobile-close{ display:inline-flex!important; flex:0 0 38px!important; width:38px!important; height:38px!important; align-items:center!important; justify-content:center!important; border:1px solid #3b3b3b!important; background:#1f1f1f!important; color:#fff!important; border-radius:8px!important; font-size:17px!important; cursor:pointer!important; } .sidebar .nav{ display:block!important; flex:1 1 auto!important; min-height:0!important; width:100%!important; overflow-y:auto!important; overflow-x:hidden!important; overscroll-behavior:contain!important; -webkit-overflow-scrolling:touch!important; padding:0 2px 18px!important; } .sidebar .nav button{ display:block; width:100%!important; min-height:42px!important; font-size:13px!important; padding:10px 10px!important; } .sidebar .nav-children{padding-left:5px!important} .sidebar .nav-parent{margin-top:12px!important} .sidebar-account-row{ position:static!important; flex:0 0 auto!important; margin:8px 4px 0!important; padding:10px 6px 4px!important; } .sidebar-bottom{ position:static!important; flex:0 0 auto!important; left:auto!important; right:auto!important; bottom:auto!important; padding:6px 8px 0!important; margin:0!important; } .mobile-menu-toggle{ display:inline-flex!important; position:sticky!important; top:8px!important; z-index:500!important; width:auto!important; min-width:112px!important; height:40px!important; min-height:40px!important; padding:0 12px!important; margin:0 0 12px!important; align-items:center!important; justify-content:center!important; gap:7px!important; border:1px solid var(--line)!important; border-radius:8px!important; background:#fff!important; color:#171717!important; box-shadow:0 2px 8px rgba(0,0,0,.08)!important; font-family:inherit!important; font-size:13px!important; font-weight:700!important; cursor:pointer!important; } .mobile-menu-icon{font-size:19px!important;line-height:1!important} .mobile-menu-label{display:inline!important} .mobile-sidebar-backdrop{ display:none!important; position:fixed!important; inset:0!important; z-index:2147482990!important; background:rgba(0,0,0,.45)!important; backdrop-filter:blur(1px); } body.mobile-sidebar-open .mobile-sidebar-backdrop{display:block!important} body.mobile-sidebar-open{overflow:hidden!important;touch-action:none} body.mobile-sidebar-open .sidebar{touch-action:pan-y!important} .main{ display:block!important; width:100%!important; min-width:0!important; margin:0!important; } } @media(max-width:390px){ .sidebar{width:92vw!important;max-width:92vw!important} .mobile-menu-toggle{min-width:105px!important} } /* V3.37.1 Stable - FIX bảng nhiều cột trên điện thoại không bị co dọc */ @media(max-width:900px){ /* Tất cả vùng chứa bảng được phép cuộn ngang độc lập */ .main .card, .main [id$="Table"], .main [class*="table-wrap"], .main [class*="Table"], .main .inventory-matrix-wrap, .main .product-cost-table-wrap, .main .accessory-order-list-wrap, .main .accessory-issue-list-wrap, .main .factory-accessory-detail-table-wrap{ max-width:100%!important; } .main .card:has(table), .main [id$="Table"]:has(table), .main [class*="table-wrap"]:has(table){ overflow-x:auto!important; overflow-y:visible!important; -webkit-overflow-scrolling:touch!important; overscroll-behavior-x:contain!important; } /* Bảng nhiều cột không được ép co về chiều rộng màn hình */ .main table{ width:max-content!important; min-width:100%!important; table-layout:auto!important; } .main table th, .main table td{ width:auto!important; min-width:max-content!important; max-width:none!important; white-space:nowrap!important; word-break:normal!important; overflow-wrap:normal!important; hyphens:none!important; vertical-align:middle!important; } /* Cột tên / mô tả cần đủ rộng để không rơi từng chữ xuống dòng */ .main table th:first-child, .main table td:first-child{ min-width:120px!important; } /* Các bảng nghiệp vụ thường có nhiều cột: tạo độ rộng tối thiểu để vuốt ngang */ #payments table, #accessoryPayments table, #foreignCurrencyPayments table, #orders table, #accessoryOrders table, #issues table, #accessoryIssues table, #production table, #reports table, #factoryDebtTable table, #factoryPaymentHistory table, #inventoryTable table, #accessoryInventoryTable table{ min-width:900px!important; } /* Bảng công nợ theo NCC trong ảnh: giữ cột NCC đủ rộng */ #fabricSupplierDebtTable table, #accessorySupplierDebtTable table{ min-width:760px!important; } #fabricSupplierDebtTable th:first-child, #fabricSupplierDebtTable td:first-child, #accessorySupplierDebtTable th:first-child, #accessorySupplierDebtTable td:first-child{ min-width:180px!important; white-space:normal!important; word-break:normal!important; overflow-wrap:break-word!important; } /* Không để card cố cắt phần bảng rộng */ .main .card:has(table){ padding-bottom:12px!important; } } /* Mobile rất nhỏ vẫn giữ bảng dạng desktop thu gọn và vuốt ngang */ @media(max-width:600px){ .main table{ font-size:11px!important; } .main table th, .main table td{ padding:8px 9px!important; } /* Ghi đè rule cũ từng đặt width 100% cho table/cột */ .main table th, .main table td{ flex:none!important; } } /* V3.37.1 Stable - danh mục mobile luôn mở được, kể cả đang xem bảng/popup */ .mobile-menu-floating{display:none} @media(max-width:900px){ .mobile-menu-floating{ display:inline-flex!important; position:fixed!important; top:calc(env(safe-area-inset-top,0px) + 8px)!important; left:10px!important; z-index:2147483550!important; height:40px!important; min-height:40px!important; padding:0 12px!important; align-items:center!important; justify-content:center!important; gap:7px!important; border:1px solid #d5d5d0!important; border-radius:8px!important; background:#fff!important; color:#171717!important; box-shadow:0 4px 14px rgba(0,0,0,.14)!important; font-family:inherit!important; font-size:13px!important; font-weight:700!important; cursor:pointer!important; pointer-events:auto!important; } .mobile-menu-floating span:first-child{font-size:18px;line-height:1} /* Nút cũ trong .main không cần chiếm chỗ nữa, tránh có 2 nút */ #mobileMenuToggle{display:none!important} /* Sidebar phải nổi trên cả popup/modal và bảng dữ liệu */ .sidebar{ z-index:2147483640!important; } .mobile-sidebar-backdrop{ z-index:2147483630!important; } /* Khi menu mở, modal/bảng phía sau không nhận thao tác */ body.mobile-sidebar-open .modal, body.mobile-sidebar-open .main{ pointer-events:none!important; } body.mobile-sidebar-open .sidebar, body.mobile-sidebar-open .mobile-sidebar-backdrop{ pointer-events:auto!important; } /* chừa khoảng trên để nút nổi không che tiêu đề trang */ .main{ padding-top:60px!important; } /* Bỏ dấu › ở đầu các danh mục con trên mobile */ .nav-children button:before{ content:none!important; display:none!important; } .nav-children button{ padding-left:12px!important; } } @media(max-width:390px){ .mobile-menu-floating{ left:8px!important; height:38px!important; min-height:38px!important; padding:0 10px!important; font-size:12px!important; } .main{padding-top:56px!important} } /* V3.37.1 Stable - Header cố định trên mobile */ .mobile-app-header{display:none} @media(max-width:900px){ .mobile-app-header{ display:grid!important; grid-template-columns:minmax(92px,1fr) auto minmax(92px,1fr)!important; align-items:center!important; position:fixed!important; top:0!important; left:0!important; right:0!important; height:calc(54px + env(safe-area-inset-top,0px))!important; padding:env(safe-area-inset-top,0px) 10px 0!important; background:rgba(255,255,255,.98)!important; border-bottom:1px solid #deded7!important; box-shadow:0 2px 10px rgba(0,0,0,.06)!important; z-index:2147483550!important; backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); } .mobile-app-header .mobile-menu-floating{ display:inline-flex!important; position:static!important; justify-self:start!important; width:auto!important; min-width:0!important; height:38px!important; min-height:38px!important; padding:0 9px!important; margin:0!important; gap:6px!important; border:0!important; border-radius:7px!important; background:transparent!important; box-shadow:none!important; color:#171717!important; visibility:visible; } .mobile-app-header .mobile-menu-floating:hover, .mobile-app-header .mobile-menu-floating:active{ background:#f2f2ef!important; } .mobile-header-menu-icon{font-size:20px!important;line-height:1!important} .mobile-header-menu-label{font-size:12px!important;font-weight:700!important} .mobile-header-brand{ justify-self:center!important; color:#111!important; font-family:inherit!important; font-size:14px!important; font-weight:900!important; letter-spacing:.045em!important; line-height:1!important; white-space:nowrap!important; text-align:center!important; } .mobile-header-spacer{ width:100%!important; min-width:92px!important; } /* Nội dung bắt đầu ngay dưới header cố định */ .main{ padding-top:calc(54px + env(safe-area-inset-top,0px) + 10px)!important; } /* Khi mở menu, header vẫn giữ cố định nhưng nút menu ẩn để sidebar nằm trên cùng */ body.mobile-sidebar-open .mobile-app-header{ z-index:2147483550!important; } body.mobile-sidebar-open .mobile-app-header .mobile-menu-floating{ visibility:hidden!important; } /* Sidebar phải nằm cao hơn header */ .sidebar{z-index:2147483640!important} .mobile-sidebar-backdrop{z-index:2147483630!important} } @media(max-width:390px){ .mobile-app-header{ grid-template-columns:minmax(76px,1fr) auto minmax(76px,1fr)!important; padding-left:7px!important; padding-right:7px!important; } .mobile-header-brand{ font-size:12.5px!important; letter-spacing:.025em!important; } .mobile-header-menu-label{display:none!important} .mobile-app-header .mobile-menu-floating{width:38px!important;padding:0!important} .mobile-header-spacer{min-width:76px!important} .main{padding-top:calc(54px + env(safe-area-inset-top,0px) + 8px)!important} } /* V3.37.1 Stable - URL routing */ .nav button[data-panel].active{background:#262626!important;color:#fff!important} /* V3.37.1 Stable - Mobile header đen + chống co dọc toàn bộ bảng */ @media(max-width:900px){ .mobile-app-header{ background:#111!important; border-bottom:1px solid #2b2b2b!important; box-shadow:0 2px 10px rgba(0,0,0,.18)!important; } .mobile-app-header .mobile-menu-floating{ width:40px!important; min-width:40px!important; height:40px!important; padding:0!important; border:0!important; background:transparent!important; color:#fff!important; box-shadow:none!important; } .mobile-app-header .mobile-menu-floating:hover, .mobile-app-header .mobile-menu-floating:active{ background:#242424!important; } .mobile-header-menu-icon{ color:#fff!important; font-size:22px!important; } .mobile-header-brand{ color:#fff!important; font-size:14px!important; font-weight:900!important; letter-spacing:.05em!important; } /* Mọi card / wrapper có table đều cuộn ngang thay vì ép cột */ .main .card:has(table), .main [id$="Table"]:has(table), .main [class*="table-wrap"]:has(table), .main [class*="table-container"]:has(table), .main [class*="matrix-wrap"]:has(table){ overflow-x:auto!important; overflow-y:visible!important; -webkit-overflow-scrolling:touch!important; overscroll-behavior-x:contain!important; } /* Không cho browser co table về chiều rộng màn hình */ .main table{ width:max-content!important; min-width:100%!important; table-layout:auto!important; border-collapse:collapse!important; } .main table col, .main table colgroup{ width:auto!important; } .main table th, .main table td{ width:auto!important; min-width:max-content!important; max-width:none!important; white-space:nowrap!important; word-break:keep-all!important; overflow-wrap:normal!important; hyphens:none!important; writing-mode:horizontal-tb!important; text-orientation:mixed!important; vertical-align:middle!important; } /* Cột chứa tên/mô tả cho phép xuống dòng theo từ nhưng không rơi từng ký tự */ .main table td[data-label*="Tên"], .main table th[data-label*="Tên"], .main table td:first-child, .main table th:first-child{ min-width:110px!important; word-break:normal!important; overflow-wrap:normal!important; } /* Các bảng nghiệp vụ nhiều cột cần canvas rộng để vuốt ngang */ #orders table, #accessoryOrders table, #payments table, #accessoryPayments table, #foreignCurrencyPayments table, #issues table, #accessoryIssues table, #production table, #productionSummaryReport table, #reports table, #inventory table, #accessoryInventory table, #fabricOrderReport table, #fabricInventoryValueReport table, #accessoryInventoryValueReport table, #factoryDebtTable table, #factoryPaymentHistory table, #fabricProductDetailContent table, #accessoryInventoryDetailContent table, #finishedProductDetailModal table, #productionCostModal table, #orderViewModal table, #accessoryOrderViewModal table{ min-width:900px!important; } /* Bảng chi tiết từng loại vải trong ảnh */ #orderViewModal table th, #orderViewModal table td, #accessoryOrderViewModal table th, #accessoryOrderViewModal table td{ min-width:95px!important; } #orderViewModal table th:nth-child(2), #orderViewModal table td:nth-child(2), #orderViewModal table th:nth-child(3), #orderViewModal table td:nth-child(3){ min-width:150px!important; white-space:normal!important; word-break:normal!important; overflow-wrap:normal!important; } /* Modal trên mobile không tự bóp table */ .modal .dialog{ overflow-y:auto!important; overflow-x:hidden!important; } .modal .dialog .card:has(table), .modal .dialog [class*="table-wrap"]:has(table), .modal .dialog [id$="Table"]:has(table){ overflow-x:auto!important; max-width:100%!important; } } @media(max-width:600px){ .main table th, .main table td{ font-size:11px!important; padding:8px 9px!important; } .mobile-header-brand{font-size:13px!important} } /* V3.37.1 Stable - FIX popup Lọc theo ngày trên mobile bị nằm dưới ô khác */ .mobile-date-filter-backdrop{display:none} @media(max-width:900px){ /* Mọi ancestor của bộ lọc đang mở phải thoát clipping/stacking thấp */ .panel.roway-date-filter-host-open, .card.roway-date-filter-host-open, .toolbar.roway-date-filter-host-open, .toolbar .left:has(.roway-date-filter:not(.roway-date-filter-collapsed)){ overflow:visible!important; position:relative!important; z-index:2147483400!important; } .roway-date-filter-in-toolbar{ z-index:2147483450!important; } .roway-date-filter-in-toolbar:not(.roway-date-filter-collapsed){ z-index:2147483460!important; } .roway-date-filter-in-toolbar .roway-date-filter-body{ z-index:2147483470!important; pointer-events:auto!important; isolation:isolate!important; } body.roway-mobile-date-filter-open .mobile-date-filter-backdrop{ display:block!important; position:fixed!important; inset:0!important; z-index:2147483300!important; background:rgba(0,0,0,.10)!important; pointer-events:auto!important; } /* Popup lọc nằm trên backdrop, nhưng dưới header/menu mobile */ body.roway-mobile-date-filter-open .roway-date-filter-in-toolbar:not(.roway-date-filter-collapsed){ position:relative!important; z-index:2147483480!important; } /* Các ô/bảng khác không được chặn thao tác của popup */ body.roway-mobile-date-filter-open .main .panel.active{ position:relative!important; z-index:2147483350!important; } } @media(max-width:600px){ .roway-date-filter-in-toolbar .roway-date-filter-body{ position:fixed!important; left:8px!important; right:8px!important; top:calc(58px + env(safe-area-inset-top,0px))!important; bottom:auto!important; width:auto!important; min-width:0!important; max-width:none!important; max-height:calc(100dvh - 76px - env(safe-area-inset-top,0px))!important; overflow-y:auto!important; overflow-x:hidden!important; margin:0!important; padding:12px!important; background:#fff!important; border:1px solid #d8d8d2!important; border-radius:12px!important; box-shadow:0 14px 40px rgba(0,0,0,.22)!important; z-index:2147483470!important; -webkit-overflow-scrolling:touch!important; touch-action:pan-y!important; } .roway-date-filter-in-toolbar .roway-date-filter-body button, .roway-date-filter-in-toolbar .roway-date-filter-body input, .roway-date-filter-in-toolbar .roway-date-filter-body label{ pointer-events:auto!important; touch-action:manipulation!important; } } /* V3.37.1 Stable - FIX triệt để Lọc theo ngày trên mobile */ .roway-date-filter-sheet-head{display:none} @media(max-width:900px){ body.roway-mobile-date-filter-open{ overflow:hidden!important; } body.roway-mobile-date-filter-open .mobile-date-filter-backdrop{ display:block!important; position:fixed!important; inset:0!important; background:rgba(0,0,0,.42)!important; z-index:2147483600!important; pointer-events:auto!important; } /* Không dùng stacking context của toolbar/card khi sheet đang mở */ body.roway-mobile-date-filter-open .roway-date-filter-in-toolbar:not(.roway-date-filter-collapsed){ position:static!important; z-index:auto!important; } body.roway-mobile-date-filter-open .roway-date-filter-in-toolbar:not(.roway-date-filter-collapsed) .roway-date-filter-body{ display:block!important; position:fixed!important; left:8px!important; right:8px!important; top:auto!important; bottom:calc(8px + env(safe-area-inset-bottom,0px))!important; width:auto!important; min-width:0!important; max-width:none!important; max-height:calc(100dvh - 80px - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px))!important; overflow-y:auto!important; overflow-x:hidden!important; margin:0!important; padding:14px!important; background:#fff!important; border:1px solid #d8d8d2!important; border-radius:16px!important; box-shadow:0 20px 60px rgba(0,0,0,.35)!important; z-index:2147483646!important; visibility:visible!important; opacity:1!important; pointer-events:auto!important; transform:none!important; isolation:isolate!important; -webkit-overflow-scrolling:touch!important; touch-action:pan-y!important; } .roway-date-filter-sheet-head{ display:flex!important; align-items:center!important; justify-content:space-between!important; gap:12px!important; margin:0 0 12px!important; padding:0 0 10px!important; border-bottom:1px solid #e7e7e2!important; font-size:15px!important; } .roway-date-filter-sheet-close{ display:inline-flex!important; align-items:center!important; justify-content:center!important; width:36px!important; height:36px!important; min-height:36px!important; padding:0!important; border:1px solid #ddd!important; border-radius:8px!important; background:#fff!important; color:#111!important; font-size:16px!important; cursor:pointer!important; } body.roway-mobile-date-filter-open .roway-date-filter-presets{ display:grid!important; grid-template-columns:repeat(2,minmax(0,1fr))!important; gap:8px!important; width:100%!important; } body.roway-mobile-date-filter-open .roway-date-filter-presets .btn{ width:100%!important; min-height:42px!important; } body.roway-mobile-date-filter-open .roway-date-filter-custom{ display:grid!important; grid-template-columns:1fr 1fr!important; gap:10px!important; width:100%!important; margin-top:12px!important; } body.roway-mobile-date-filter-open .roway-date-filter-custom label{ display:block!important; font-size:12px!important; } body.roway-mobile-date-filter-open .roway-date-filter-custom input{ width:100%!important; height:42px!important; min-height:42px!important; margin-top:5px!important; font-size:16px!important; } body.roway-mobile-date-filter-open .roway-date-filter-custom .roway-date-apply{ grid-column:1/-1!important; width:100%!important; min-height:44px!important; } } /* V3.37.1 Stable - Universal mobile date-filter sheet */ @media(max-width:900px){ body.roway-mobile-date-filter-open .roway-date-filter:not(.roway-date-filter-collapsed) .roway-date-filter-body{ display:block!important; position:fixed!important; left:8px!important; right:8px!important; top:auto!important; bottom:calc(8px + env(safe-area-inset-bottom,0px))!important; width:auto!important; min-width:0!important; max-width:none!important; max-height:calc(100dvh - 80px - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px))!important; overflow-y:auto!important; overflow-x:hidden!important; margin:0!important; padding:14px!important; background:#fff!important; border:1px solid #d8d8d2!important; border-radius:16px!important; box-shadow:0 20px 60px rgba(0,0,0,.35)!important; z-index:2147483646!important; visibility:visible!important; opacity:1!important; pointer-events:auto!important; transform:none!important; isolation:isolate!important; -webkit-overflow-scrolling:touch!important; touch-action:pan-y!important; } body.roway-mobile-date-filter-open .roway-date-filter:not(.roway-date-filter-collapsed){ z-index:2147483646!important; } body.roway-mobile-date-filter-open .roway-date-filter:not(.roway-date-filter-collapsed) .roway-date-filter-presets{ display:grid!important; grid-template-columns:repeat(2,minmax(0,1fr))!important; gap:8px!important; width:100%!important; } body.roway-mobile-date-filter-open .roway-date-filter:not(.roway-date-filter-collapsed) .roway-date-filter-presets .btn{ width:100%!important; min-height:42px!important; } body.roway-mobile-date-filter-open .roway-date-filter:not(.roway-date-filter-collapsed) .roway-date-filter-custom{ display:grid!important; grid-template-columns:1fr 1fr!important; gap:10px!important; width:100%!important; margin-top:12px!important; } body.roway-mobile-date-filter-open .roway-date-filter:not(.roway-date-filter-collapsed) .roway-date-filter-custom label{ display:block!important; width:100%!important; } body.roway-mobile-date-filter-open .roway-date-filter:not(.roway-date-filter-collapsed) .roway-date-filter-custom input{ width:100%!important; height:42px!important; min-height:42px!important; margin-top:5px!important; font-size:16px!important; } body.roway-mobile-date-filter-open .roway-date-filter:not(.roway-date-filter-collapsed) .roway-date-filter-custom .roway-date-apply{ grid-column:1/-1!important; width:100%!important; min-height:44px!important; } } /* V3.37.1 Stable - Đơn đặt vải: lọc ngày body-level portal trên mobile */ .orders-date-filter-portal{display:none} @media(max-width:900px){ .orders-date-filter-portal.open{ display:block!important; position:fixed!important; inset:0!important; z-index:2147483645!important; pointer-events:auto!important; } .orders-date-filter-portal-backdrop{ position:absolute!important; inset:0!important; background:rgba(0,0,0,.45)!important; } .orders-date-filter-sheet{ position:absolute!important; left:8px!important; right:8px!important; bottom:calc(8px + env(safe-area-inset-bottom,0px))!important; max-height:calc(100dvh - 80px - env(safe-area-inset-top,0px))!important; overflow-y:auto!important; padding:14px!important; background:#fff!important; border-radius:16px!important; box-shadow:0 20px 60px rgba(0,0,0,.35)!important; z-index:1!important; -webkit-overflow-scrolling:touch!important; } .orders-date-filter-sheet-head{ display:flex!important; align-items:center!important; justify-content:space-between!important; gap:10px!important; padding-bottom:10px!important; margin-bottom:12px!important; border-bottom:1px solid #e7e7e2!important; font-size:15px!important; } .orders-date-filter-close{ width:38px!important; height:38px!important; min-height:38px!important; border:1px solid #ddd!important; border-radius:8px!important; background:#fff!important; color:#111!important; font-size:16px!important; } .orders-date-filter-presets{ display:grid!important; grid-template-columns:repeat(2,minmax(0,1fr))!important; gap:8px!important; } .orders-date-filter-presets .btn{ width:100%!important; min-height:42px!important; } .orders-date-filter-custom{ display:grid!important; grid-template-columns:1fr 1fr!important; gap:10px!important; margin-top:12px!important; } .orders-date-filter-custom label{ display:block!important; font-size:12px!important; font-weight:700!important; } .orders-date-filter-custom input{ width:100%!important; height:42px!important; min-height:42px!important; margin-top:5px!important; font-size:16px!important; } .orders-date-filter-custom #ordersDatePortalApply{ grid-column:1/-1!important; width:100%!important; min-height:44px!important; } body.orders-date-filter-portal-open{overflow:hidden!important} } /* V3.37.1 Stable - Dữ liệu theo tài khoản */ .account-data-card{margin-top:14px} .account-cloud-status{margin:10px 0;padding:10px 12px;border:1px solid #b9c8db;border-radius:9px;background:#f6f9fc;font-size:12px;font-weight:650} .account-cloud-status.account-cloud-error{border-color:#e1a4a4;background:#fff5f5;color:#9b1c1c} .account-cloud-actions{display:flex;gap:8px;flex-wrap:wrap;margin:10px 0} .account-workspace-area,.account-share-area{margin-top:16px;padding-top:14px;border-top:1px solid var(--line)} .account-workspace-create{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:8px 0 12px} .account-workspace-create input{flex:1;min-width:230px}.account-workspace-create select{min-width:170px} .account-workspace-list,.account-member-list{display:grid;gap:8px} .account-workspace-item,.account-member-item{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 12px;border:1px solid var(--line);border-radius:9px;background:#fafafa} .account-workspace-item.active{border-color:#222;background:#f3f3f3} body.account-workspace-readonly .purchase-action, body.account-workspace-readonly .inventory-action, body.account-workspace-readonly .production-action, body.account-workspace-readonly .accounting-action{opacity:.45!important} @media(max-width:600px){ .account-cloud-actions{display:grid;grid-template-columns:1fr} .account-cloud-actions .btn{width:100%!important} .account-workspace-create{display:grid;grid-template-columns:1fr} .account-workspace-create input,.account-workspace-create select,.account-workspace-create .btn{width:100%!important;min-width:0} .account-workspace-item,.account-member-item{align-items:flex-start;flex-direction:column} } /* V3.37.1 Stable - Unified Cloud Login */ .unified-login-box{width:min(92vw,420px)!important} .login-mode-title{font-size:13px;font-weight:900;margin:16px 0 10px} .unified-login-primary,.unified-login-secondary{width:100%;min-height:44px;margin-top:8px} .legacy-login-link{display:block;width:100%;margin-top:14px;border:0;background:transparent;color:#4d67a8;font:inherit;font-size:12px;text-decoration:underline;cursor:pointer} .login-cloud-message{min-height:18px;margin-top:9px;font-size:11px;color:#2d6b43}.login-cloud-message.error{color:#a52727} .workspace-choose-dialog{width:min(94vw,680px)!important} .workspace-choose-list{display:grid;gap:8px;margin:14px 0} .workspace-choose-item{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;padding:13px 14px;border:1px solid var(--line);border-radius:10px;background:#fff;text-align:left;cursor:pointer;font:inherit} .workspace-choose-item:hover{border-color:#888;background:#fafafa} .workspace-first-actions{display:grid;gap:9px;padding-top:14px;border-top:1px solid var(--line)} .workspace-first-actions input{width:100%;height:42px} .user-account-grid{grid-template-columns:repeat(5,minmax(0,1fr))!important} @media(max-width:1100px){.user-account-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}} @media(max-width:600px){.user-account-grid{grid-template-columns:1fr!important}.workspace-choose-dialog{width:calc(100vw - 8px)!important}} /* V3.37.1 Stable - Cloud staff account admin UI */ .user-cloud-create-card{border-color:#cbd8ea!important;background:#fbfdff!important} .user-cloud-create-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px} .user-cloud-create-grid label{font-size:12px;font-weight:700;color:#333} .user-cloud-create-grid input,.user-cloud-create-grid select{margin-top:7px;width:100%;height:46px;border:1px solid #d6d9de;border-radius:8px;padding:0 12px;background:#fff;font-size:14px} .user-cloud-create-grid .pin-field input{padding-right:42px} .user-cloud-create-actions{margin-top:14px} @media(max-width:1000px){.user-cloud-create-grid{grid-template-columns:repeat(2,minmax(0,1fr))}} @media(max-width:600px){.user-cloud-create-grid{grid-template-columns:1fr}.user-cloud-create-actions .btn{width:100%!important}} /* V3.37.1 Stable Multi Tenant */.company-saas-card{margin-top:14px;border:1px solid #bfcde0!important}.company-create-row{display:flex;gap:8px;flex-wrap:wrap;margin:10px 0}.company-create-row input{flex:1;min-width:210px}.company-tenant-list{display:grid;gap:8px}@media(max-width:600px){.company-create-row{display:grid}.company-create-row input,.company-create-row .btn{width:100%!important;min-width:0}}/* V3.37.1 Stable */ .company-members-card{margin:0 0 14px;border-color:#cad5e5!important} #companyMembersCloudTable select,#companyMembersCloudTable input,#saasAdminCompanies select,#saasAdminCompanies input{height:34px;min-height:34px;padding:4px 7px;font-size:11px} @media(max-width:600px){#companyMembersCloudTable,#saasAdminCompanies{overflow-x:auto;-webkit-overflow-scrolling:touch}#companyMembersCloudTable table,#saasAdminCompanies table{min-width:820px!important}} /* V3.37.1 Stable - normalized PostgreSQL company storage */ .normalized-db-note{margin:8px 0 10px;padding:10px 12px;border:1px solid #cfe0d2;border-radius:8px;background:#f7fbf7;font-size:12px;line-height:1.5} .tenant-normalized-status{display:flex;align-items:center;gap:7px;margin-top:8px;font-size:11px;font-weight:700;color:#666} .tenant-sync-dot{width:8px;height:8px;border-radius:50%;background:#999;flex:0 0 8px} .tenant-normalized-status.saving .tenant-sync-dot{background:#d49b25;animation:rowayPulse 1s infinite} .tenant-normalized-status.saved{color:#2b6d43}.tenant-normalized-status.saved .tenant-sync-dot{background:#2f8b54} .tenant-normalized-status.error{color:#a42626}.tenant-normalized-status.error .tenant-sync-dot{background:#c83939} @keyframes rowayPulse{50%{opacity:.35}} /* V3.37.1 Stable - typed fabric core PostgreSQL */ .typed-db-actions{display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin-top:9px} .typed-db-actions .badge{min-height:28px;display:inline-flex;align-items:center} @media(max-width:600px){.typed-db-actions{display:grid;grid-template-columns:1fr}.typed-db-actions .btn,.typed-db-actions .badge{width:100%!important;justify-content:center}} /* V3.37.1 Stable - SaaS billing, finance and document cloud */ .subscription-status-card{display:flex;justify-content:space-between;gap:10px;align-items:center;margin-top:8px;padding:10px 12px;border:1px solid #ddd;border-radius:9px;background:#fafafa;font-size:12px} .subscription-status-card.ok{border-color:#b9dac3;background:#f4fbf6;color:#245d37}.subscription-status-card.blocked{border-color:#e6bcbc;background:#fff5f5;color:#9b2424} .company-finance-cloud,.company-document-cloud{margin-top:16px;padding-top:14px;border-top:1px solid var(--line)} .document-upload-row{display:grid;grid-template-columns:160px 160px 1fr 1.4fr auto;gap:8px;align-items:center;margin:9px 0 12px} .document-upload-row input,.document-upload-row select{min-height:38px} #companyFinanceCloudSummary{grid-template-columns:repeat(4,minmax(0,1fr))} #companyDocumentList{overflow-x:auto} #saasAdminCompanies table{min-width:1500px!important} @media(max-width:900px){.document-upload-row{grid-template-columns:1fr 1fr}.document-upload-row input[type=file],.document-upload-row button{grid-column:1/-1}#companyFinanceCloudSummary{grid-template-columns:repeat(2,minmax(0,1fr))}} @media(max-width:600px){.subscription-status-card{align-items:flex-start;flex-direction:column}.document-upload-row{grid-template-columns:1fr}.document-upload-row>*{grid-column:1!important;width:100%!important}#companyFinanceCloudSummary{grid-template-columns:1fr}} /* V3.37.1 Stable - SaaS customer onboarding */ .saas-onboarding-card{margin-bottom:14px;border:1px solid #c7d6ea!important;background:#fbfdff!important} .saas-onboarding-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;margin-top:12px} .saas-onboarding-grid label{font-size:11px;font-weight:750;color:#40495b} .saas-onboarding-grid input,.saas-onboarding-grid select{width:100%;height:42px;margin-top:6px} .saas-onboarding-actions{margin-top:12px} .saas-onboarding-status{min-height:20px;margin-top:10px;font-size:12px;font-weight:650}.saas-onboarding-status.loading{color:#7a5a12}.saas-onboarding-status.success{color:#21663c}.saas-onboarding-status.error{color:#a62a2a} #saasAdminCompanies table{min-width:1750px!important} @media(max-width:1200px){.saas-onboarding-grid{grid-template-columns:repeat(2,minmax(0,1fr))}} @media(max-width:600px){.saas-onboarding-grid{grid-template-columns:1fr}.saas-onboarding-actions{display:grid;grid-template-columns:1fr}.saas-onboarding-actions .btn{width:100%!important}} /* V3.37.1 Stable - SaaS plans */ .saas-plan-card{margin-bottom:14px;border-color:#d6cbea!important}.saas-plan-dialog{width:min(96vw,1100px)!important} .saas-plan-form{grid-template-columns:repeat(4,minmax(0,1fr))!important}.saas-plan-modules{margin:16px 0;padding-top:14px;border-top:1px solid var(--line)}.saas-plan-module-search{width:100%;margin:10px 0 12px}.saas-plan-modules>#saasPlanModuleGrid{display:block}.saas-plan-module-group{margin-bottom:12px} #saasPlanList{overflow-x:auto}#saasPlanList table{min-width:980px!important} .company-plan-usage{margin-top:8px;padding:10px 12px;border:1px solid #ddd;border-radius:9px;background:#fafafa;font-size:12px}.company-plan-usage>div:first-child{display:flex;justify-content:space-between;gap:10px} @media(max-width:900px){.saas-plan-form{grid-template-columns:repeat(2,minmax(0,1fr))!important}} @media(max-width:600px){.saas-plan-form{grid-template-columns:1fr!important}.company-plan-usage>div:first-child{flex-direction:column}} /* V3.37.1 Stable - SaaS orders / renewals */ .saas-order-card{margin-bottom:14px;border-color:#c8ddcc!important}.saas-order-dialog{width:min(94vw,850px)!important}.saas-payment-dialog{width:min(94vw,680px)!important} #saasOrderList{overflow-x:auto}#saasOrderList table{min-width:1150px!important}.company-subscription-history{margin-top:14px;padding-top:12px;border-top:1px solid var(--line)}#companySaasOrderHistory{overflow-x:auto}#companySaasOrderHistory table{min-width:760px!important} /* V3.37.1 Stable - hardening, quota, backup, session guard */ .company-security-card{margin-top:12px;padding:12px;border:1px solid #c9d4df;border-radius:10px;background:#fbfcfd} .security-status-grid{display:flex;gap:7px;flex-wrap:wrap;margin:8px 0 10px}.security-check{display:flex;align-items:center;gap:6px;padding:7px 9px;border:1px solid #ddd;border-radius:8px;font-size:11px}.security-check.ok{border-color:#b9dac3;background:#f4fbf6;color:#25633b}.security-check.bad{border-color:#e4b8b8;background:#fff4f4;color:#9d2727}.security-check.info{background:#f7f8fa} .company-backup-list{margin-top:10px;overflow-x:auto}.company-backup-list table{min-width:760px!important} @media(max-width:600px){.company-security-card .actions{display:grid;grid-template-columns:1fr}.company-security-card .actions .btn{width:100%!important}.security-status-grid{display:grid;grid-template-columns:1fr}} /* V3.37.1 Stable - production preflight */ .saas-preflight-card{margin-bottom:14px;border:1px solid #bfd8c6!important;background:#fbfefc!important}.preflight-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:10px 0}.preflight-item{display:flex;gap:9px;align-items:center;padding:10px;border:1px solid #ddd;border-radius:9px;background:#fff}.preflight-item.ok{border-color:#b8d8c1}.preflight-item.bad{border-color:#e3b4b4;background:#fff8f8}.preflight-icon{display:flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:50%;background:#eee;font-weight:900}.preflight-item.ok .preflight-icon{background:#e5f4e9;color:#27663b}.preflight-item.bad .preflight-icon{background:#fbe5e5;color:#a52a2a}.preflight-item span{display:block;margin-top:3px;font-size:10px;color:#667085}.preflight-meta{grid-column:1/-1;padding:8px 10px;font-size:11px;color:#667085} @media(max-width:900px){.preflight-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:600px){.preflight-grid{grid-template-columns:1fr}} /* V3.37.1 Stable - E2E tenant test status */ .tenant-e2e-box{margin-top:12px;padding:12px;border:1px solid #b8d8c1;border-radius:10px;background:#fbfefc} .tenant-e2e-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:8px 0} .tenant-e2e-item{display:flex;align-items:center;gap:8px;padding:9px;border:1px solid #cfe3d4;border-radius:8px;background:#fff;font-size:11px} .tenant-e2e-item strong{display:flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:50%;background:#e6f5ea;color:#28653c} @media(max-width:900px){.tenant-e2e-grid{grid-template-columns:repeat(2,minmax(0,1fr))}} @media(max-width:600px){.tenant-e2e-grid{grid-template-columns:1fr}} /* V3.37.1 Stable - role/member hardening */ .role-test-summary{margin:10px 0;padding:10px 12px;border:1px solid #b8d8c1;border-radius:9px;background:#f8fcf9;font-size:11px}.role-test-summary strong{display:block;color:#245e37;margin-bottom:4px}.role-test-summary span{color:#667085} /* V3.37.1 Stable - backend permission guard */ .company-security-card .actions{align-items:center} /* V3.37.1 Stable - module-scoped cloud persistence */ .scoped-db-status{display:flex;gap:8px;align-items:center;margin-top:8px;padding:8px 10px;border:1px solid #c8d8ea;border-radius:8px;background:#f8fbff;font-size:11px} .scoped-db-status strong{white-space:nowrap;color:#274f78}.scoped-db-status span{color:#667085} @media(max-width:600px){.scoped-db-status{align-items:flex-start;flex-direction:column}} /* V3.37.1 Stable - per-module concurrency */ .module-revision-status{border-color:#d6c9e8;background:#fcfaff}.module-revision-status strong{color:#67468c} /* V3.37.1 Stable - record-level concurrency */ .record-revision-status{border-color:#c5ddd5;background:#f8fdfb}.record-revision-status strong{color:#2c6b57} /* V3.37.1 Stable Realtime */.realtime-company-row{display:flex;align-items:center;gap:8px;margin-top:8px}.realtime-company-row .small{color:#667085}@media(max-width:600px){.realtime-company-row{align-items:flex-start;flex-direction:column}}/* V3.37.1 Stable Offline */.realtime-company-row+.realtime-company-row{margin-top:6px} /* V3.37.1 Stable - Cloud audit */ .cloud-audit-card{margin-top:14px;border-color:#d8d0e8!important}.cloud-audit-card .toolbar{margin:10px 0}.cloud-audit-card .toolbar .left{display:flex;gap:8px;flex-wrap:wrap}.cloud-audit-card .toolbar input{min-width:240px}.cloud-audit-card .toolbar select{min-width:180px}#cloudAuditTable{overflow-x:auto}#cloudAuditTable table{min-width:1180px!important} @media(max-width:600px){.cloud-audit-card .toolbar .left{display:grid;grid-template-columns:1fr}.cloud-audit-card .toolbar input,.cloud-audit-card .toolbar select{width:100%!important;min-width:0}} /* V3.37.1 Stable - record restore from audit */ #cloudAuditTable .btn.danger{white-space:nowrap} /* V3.37.1 Stable - business integrity & atomic persistence */ .atomic-save-status{border-color:#e0d1b9;background:#fffdf8}.atomic-save-status strong{color:#7b5720} /* V3.37.1 Stable - business guards */ .business-guard-status{border-color:#c7d9cc;background:#f9fcfa}.business-guard-status strong{color:#2e6540} /* V3.37.1 Stable - accessory movement lot ledger */ .accessory-ledger-status{border-color:#c7d6e5;background:#f9fbfd}.accessory-ledger-status strong{color:#315e87} /* V3.37.1 Stable - fabric movement roll ledger */ .fabric-ledger-status{border-color:#d1c8e3;background:#fbf9fd}.fabric-ledger-status strong{color:#634a86}.roll-ledger-card{margin-top:10px;border-color:#d1c8e3!important}.roll-ledger-card>strong{display:block;margin-bottom:6px} /* V3.37.1 Stable */.production-cost-integrity-status{border-color:#e1cbbd;background:#fffaf7}.production-cost-integrity-status strong{color:#875338}/* V3.37.1 Stable */.finance-integrity-status{border-color:#c5d8d8;background:#f8fcfc}.finance-integrity-status strong{color:#356b6b} /* V3.37.1 Stable - archive & historical reference protection */ .archive-integrity-status{border-color:#d7d7d7;background:#fbfbfb}.archive-integrity-status strong{color:#555}.archive-badge{margin-left:6px}.archived-row{opacity:.68} /* V3.37.1 Stable - CRUD/archive smoke test */ #crudArchiveTestStatus{margin-top:8px} /* V3.37.1 Stable - responsive production hardening */ html,body{max-width:100%;overflow-x:hidden} .app,.main,.panel,.card,.toolbar,.stats,.form-grid,.summary-box,.detail-grid{min-width:0} img,svg,canvas{max-width:100%} input,select,textarea,button{max-width:100%} .modal{padding:14px} .modal .dialog{max-width:calc(100vw - 28px)!important;max-height:calc(100dvh - 28px)!important;overflow:auto!important} .modal .dialog>*,.modal .dialog .form-grid,.modal .dialog .grid{min-width:0} .modal .dialog input,.modal .dialog select,.modal .dialog textarea{width:100%;min-width:0} .toolbar{display:flex;align-items:center;gap:8px;flex-wrap:wrap} .toolbar .left,.toolbar .right{display:flex;align-items:center;gap:8px;flex-wrap:wrap;min-width:0} .toolbar input,.toolbar select{min-width:0} .stats{grid-template-columns:repeat(auto-fit,minmax(150px,1fr))} table,table.sortable-table{ writing-mode:horizontal-tb!important; text-orientation:mixed!important; } table th,table td{ writing-mode:horizontal-tb!important; text-orientation:mixed!important; word-break:normal!important; overflow-wrap:normal!important; hyphens:none!important; } table th{white-space:nowrap!important} table td{vertical-align:middle} table td .btn,table td button{white-space:nowrap!important} .panel>div[style*="overflow:auto"], .card>div[style*="overflow:auto"], .modal .dialog>div[style*="overflow:auto"], div:has(> table.sortable-table){ max-width:100%; overflow-x:auto!important; overflow-y:visible; -webkit-overflow-scrolling:touch; } @media(max-width:900px){ body{font-size:14px} .app{display:block!important;width:100%!important;min-width:0!important} .main{width:100%!important;max-width:100vw!important;padding-left:12px!important;padding-right:12px!important;overflow-x:hidden!important} .panel{width:100%!important;min-width:0!important} .mobile-app-header{height:54px!important;min-height:54px!important;padding-top:env(safe-area-inset-top,0px)!important} .mobile-header-brand{max-width:calc(100vw - 110px)!important;overflow:hidden!important;text-overflow:ellipsis!important} .sidebar{ position:fixed!important;display:block!important;top:0!important;bottom:0!important;left:0!important; width:min(86vw,320px)!important;max-width:320px!important;height:100dvh!important; overflow-y:auto!important;overscroll-behavior:contain!important; transform:translateX(-105%);transition:transform .2s ease;visibility:hidden; } body.mobile-sidebar-open .sidebar{transform:translateX(0)!important;visibility:visible!important} .mobile-sidebar-backdrop{position:fixed!important;inset:0!important} .top{gap:10px!important} .top h1,.panel h1{font-size:22px!important;line-height:1.2!important} .toolbar{align-items:stretch!important} .toolbar .left,.toolbar .right{width:100%!important} .toolbar input,.toolbar select,.toolbar .btn{min-height:40px} .stats{grid-template-columns:repeat(2,minmax(0,1fr))!important} .form-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important} .form-grid .span2,.form-grid .span4{grid-column:span 2!important} .summary-box{grid-template-columns:repeat(2,minmax(0,1fr))!important} .dashboard-chart-grid,.dashboard-grid{grid-template-columns:1fr!important} .dashboard-chart-card{min-height:0!important} .roway-date-filter{position:relative!important;z-index:30!important;max-width:100%!important} .roway-date-filter:not(.roway-date-filter-collapsed){box-shadow:0 8px 28px rgba(0,0,0,.16)!important} .orders-date-filter-portal{z-index:2147483600!important} .orders-date-filter-sheet{max-height:min(82dvh,620px)!important;overflow:auto!important} table.sortable-table{ width:max-content!important; min-width:100%!important; table-layout:auto!important; } table.sortable-table th, table.sortable-table td{ min-width:max-content!important; max-width:none!important; white-space:nowrap!important; line-height:1.35!important; } table.sortable-table td .small{white-space:nowrap!important} table.sortable-table td[data-price] .small, #detailModal table td[data-price] .small{white-space:normal!important;min-width:160px} .product-cost-dialog,#accessoryInventoryDetailModal .dialog{width:calc(100vw - 20px)!important;max-width:calc(100vw - 20px)!important} .product-cost-head,#accessoryInventoryDetailModal .dialog-head{padding:18px 16px 12px!important} .product-cost-head h2,#accessoryInventoryDetailModal .dialog-head h2{font-size:22px!important} } @media(max-width:600px){ .main{padding-left:9px!important;padding-right:9px!important} .top{margin-bottom:10px!important} .stats,.form-grid,.summary-box,#dashboardProductionStats{grid-template-columns:1fr!important} .form-grid .span2,.form-grid .span4{grid-column:span 1!important} .toolbar .left,.toolbar .right{display:grid!important;grid-template-columns:1fr!important} .toolbar input,.toolbar select,.toolbar button,.toolbar .btn{width:100%!important;min-width:0!important} .roway-date-filter-presets{grid-template-columns:1fr 1fr!important} .roway-date-filter-custom{grid-template-columns:1fr!important} .roway-date-filter-custom .roway-date-apply{grid-column:1!important} .orders-date-filter-sheet{ position:fixed!important;left:8px!important;right:8px!important;bottom:8px!important;top:auto!important; width:auto!important;max-width:none!important;border-radius:16px!important; } .orders-date-filter-presets{display:grid!important;grid-template-columns:1fr 1fr!important} .orders-date-filter-custom{display:grid!important;grid-template-columns:1fr!important} .orders-date-filter-custom label,.orders-date-filter-custom input,.orders-date-filter-custom button{width:100%!important} .modal{padding:6px!important;align-items:flex-end!important} .modal .dialog{ width:100%!important;max-width:100%!important;max-height:calc(100dvh - 12px)!important; border-radius:14px 14px 8px 8px!important;padding:14px!important; } .modal .dialog-head,.modal .section-title{gap:8px;flex-wrap:wrap} .modal .actions{display:flex;gap:8px;flex-wrap:wrap} .modal .actions .btn{flex:1 1 140px;min-height:42px} .rolls-grid{grid-template-columns:1fr!important} .detail-grid{grid-template-columns:1fr!important} .dashboard-inventory-grid{grid-template-columns:1fr 1fr!important} .dash-bar-row{grid-template-columns:80px minmax(90px,1fr) 84px!important} .dash-donut-wrap{flex-direction:column!important} .product-cost-head,#accessoryInventoryDetailModal .dialog-head{flex-direction:column!important} .product-cost-close{width:100%!important} table.sortable-table th,table.sortable-table td{font-size:12px!important;padding:9px 10px!important} } @media(max-width:390px){ .mobile-app-header{grid-template-columns:44px 1fr 44px!important} .mobile-header-brand{font-size:12px!important;letter-spacing:.015em!important;max-width:none!important} .mobile-header-spacer{min-width:44px!important} .stats{gap:8px!important} .card{padding:11px!important} .dashboard-inventory-grid{grid-template-columns:1fr!important} .roway-date-filter-presets,.orders-date-filter-presets{grid-template-columns:1fr!important} } @media(min-width:901px) and (max-width:1440px){ .main{padding:18px!important} .toolbar{gap:7px!important} .stats{grid-template-columns:repeat(auto-fit,minmax(165px,1fr))!important} table.sortable-table th,table.sortable-table td{padding-left:10px!important;padding-right:10px!important} .dashboard-chart-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important} } /* V3.37.1 Stable */ #releaseCandidateStatus{margin-top:8px;border-width:1px} /* V3.37.1 Stable - single company account + SaaS registration */ .saas-registration-intro{margin:-2px 0 14px;line-height:1.5} .saas-registration-admin-card{margin:14px 0;border-color:#c8d7eb!important} #saasRegistrationRequests{overflow-x:auto;margin-top:10px} #saasRegistrationRequests table{min-width:1050px!important} #saasRegistrationRequests input{min-width:180px} @media(max-width:600px){.saas-registration-admin-card{padding:12px!important}#saasRegistrationRequests table{min-width:980px!important}} /* V3.37.1 Stable - fast Cloud-only login */ #cloudLoginPane .unified-login-primary:disabled{opacity:.72;cursor:wait} #cloudLoginPane .legacy-login-link{display:none!important} /* V3.37.1 Stable - SaaS approve & onboard */ #saasRegistrationRequests select{min-width:120px} #saasRegistrationRequests input[type="number"]{min-width:78px;width:78px} #saasRegistrationRequests td:last-child{white-space:nowrap} /* V3.37.1 Stable - email or phone login */ #loginCloudEmail{letter-spacing:0} /* V3.37.1 Stable - customer account lifecycle */ .saas-customer-accounts-card{margin:14px 0;border-color:#d5c9e8!important} #saasCustomerAccounts{overflow-x:auto;margin-top:10px} #saasCustomerAccounts table{min-width:1250px!important} #saasCustomerAccounts input{min-width:150px} .forced-password-modal{z-index:2147483646!important;background:rgba(0,0,0,.72)!important} .forced-password-dialog{width:min(94vw,520px)!important} body.forced-password-required .sidebar,body.forced-password-required .main,body.forced-password-required .mobile-app-header{pointer-events:none!important;user-select:none!important} .forced-password-dialog .field{margin:12px 0} @media(max-width:600px){.forced-password-dialog{width:100%!important}.forced-password-dialog .actions{display:grid!important;grid-template-columns:1fr!important}} /* V3.37.1 Stable - owner self-service password */ .owner-password-card{margin:0 0 14px;border-color:#cbd9c9!important;background:#fbfdfb!important} .owner-password-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important} @media(max-width:800px){.owner-password-grid{grid-template-columns:1fr!important}} /* V3.37.1 Stable - owner staff onboarding */ .user-cloud-create-grid{grid-template-columns:repeat(5,minmax(0,1fr))!important} @media(max-width:1100px){.user-cloud-create-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}} @media(max-width:600px){.user-cloud-create-grid{grid-template-columns:1fr!important}} /* V3.37.1 Stable - password recovery */ .forgot-password-link{display:block;width:100%;margin:9px 0 2px;border:0;background:transparent;color:#4d67a8;font:inherit;font-size:12px;text-decoration:underline;cursor:pointer} .forgot-password-intro{margin:-2px 0 14px;line-height:1.5} .forgot-back-link{display:block!important} .password-recovery-modal{z-index:2147483647!important;background:rgba(0,0,0,.74)!important} .password-recovery-dialog{width:min(94vw,520px)!important} body.password-recovery-required .app,body.password-recovery-required .mobile-app-header{pointer-events:none!important;user-select:none!important} .password-recovery-dialog .field{margin:12px 0} @media(max-width:600px){.password-recovery-dialog{width:100%!important}} /* V3.37.1 Stable - automated TEST-C E2E */ .saas-e2e-test-card{margin:14px 0;border-color:#c8d8c8!important;background:#fbfdfb!important} #saasE2ETestResults{margin-top:12px} /* V3.37.1 Stable */ .stable-release-banner{margin:0 0 14px;padding:14px 16px;border:1px solid #b9d6bf;border-radius:12px;background:#f7fbf7;display:flex;gap:10px;align-items:center;flex-wrap:wrap} .stable-release-banner strong{font-size:16px;color:#245b31}.stable-release-banner span{font-size:12px;color:#4f6254} .stable-release-gate{margin:12px 0;padding:12px;border:1px solid #d7e5d9;border-radius:10px;background:#fbfdfb} /* V3.37.1 Stable - auth routes + no-login-flash boot */ .roway-boot-splash{position:fixed;inset:0;z-index:2147483647;background:#111;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;color:#fff;opacity:1;transition:opacity .16s ease} .roway-boot-splash.done{opacity:0;pointer-events:none} .roway-boot-mark{font-size:17px;font-weight:800;letter-spacing:.08em} .roway-boot-loader{width:28px;height:28px;border:2px solid rgba(255,255,255,.22);border-top-color:#fff;border-radius:50%;animation:rowayBootSpin .75s linear infinite} @keyframes rowayBootSpin{to{transform:rotate(360deg)}} body.roway-booting{overflow:hidden!important} body.roway-booting #loginOverlay,body.roway-booting .app,body.roway-booting .mobile-app-header{visibility:hidden!important} #saasRegistrationPane,#forgotPasswordPane,#cloudLoginPane{width:100%} /* V3.37.1 Stable - hard no-flash reload */ html.roway-booting-root body{background:#111!important} html.roway-booting-root #loginOverlay, html.roway-booting-root .app, html.roway-booting-root .mobile-app-header{display:none!important;visibility:hidden!important;opacity:0!important} /* V3.37.1 Stable - automated UAT A/B */ .saas-uat-test-card{margin:14px 0;border-color:#bfcfe8!important;background:#fafcff!important} #saasUATResults{margin-top:12px} /* V3.37.1 Stable - Subscription & Billing */ .subscription-global-banner{position:sticky;top:0;z-index:85;padding:10px 18px;text-align:center;font-size:13px;font-weight:700;border-bottom:1px solid transparent} .subscription-global-banner .subscription-banner-action{margin-left:10px;padding:5px 10px;border:1px solid currentColor;border-radius:7px;background:transparent;color:inherit;font-weight:800;cursor:pointer} .subscription-global-banner.warn{background:#fff7df;color:#785700;border-color:#efd88f} .subscription-global-banner.danger{background:#fff0f0;color:#8b2020;border-color:#e8b0b0} .subscription-status-card.warning{border-color:#e9c766!important;background:#fffaf0!important} body.subscription-readonly .btn.primary:not(.subscription-allowed){filter:saturate(.55)} #saasAdminStats{grid-template-columns:repeat(7,minmax(120px,1fr))!important} @media(max-width:1100px){#saasAdminStats{grid-template-columns:repeat(3,minmax(120px,1fr))!important}} @media(max-width:600px){#saasAdminStats{grid-template-columns:repeat(2,minmax(120px,1fr))!important}} /* V3.37.1 Stable - automated Subscription test */ .saas-subscription-test-card{margin:14px 0;border-color:#e2c98f!important;background:#fffdf7!important} #saasSubscriptionTestResults{margin-top:12px} /* V3.37.1 Stable - onboarding approval fix */ #saasRegistrationRequests input[type="email"],#saasRegistrationRequests input[inputmode="tel"]{background:#fffdf5} /* V3.37.1 Stable - Owner Account & Subscription */ .account-subscription-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px} .account-subscription-item{padding:12px;border:1px solid #e4e4e4;border-radius:10px;background:#fafafa} .account-subscription-item span{display:block;font-size:11px;color:#777;margin-bottom:5px} .account-subscription-item strong{font-size:14px;word-break:break-word} .account-subscription-stats .small-value{font-size:18px!important} .account-subscription-notice{margin:12px 0;padding:12px 14px;border-radius:10px;font-size:13px} .account-subscription-notice.ok{background:#f3faf4;border:1px solid #cfe3d2;color:#245b31} .account-subscription-notice.warn{background:#fff8e7;border:1px solid #ead18c;color:#755700} .account-subscription-notice.danger{background:#fff0f0;border:1px solid #e7b4b4;color:#872525} @media(max-width:900px){.account-subscription-grid{grid-template-columns:repeat(2,minmax(0,1fr))}} @media(max-width:600px){.account-subscription-grid{grid-template-columns:1fr}} /* V3.37.1 Stable - SaaS Notification Center */ .notification-bell{border:0;background:#fff;box-shadow:0 2px 12px rgba(0,0,0,.12);border-radius:50%;width:42px;height:42px;cursor:pointer;position:relative;font-size:18px} .desktop-notification-bell{position:fixed;right:18px;top:16px;z-index:82} .mobile-notification-bell{display:none} .notification-unread-badge{position:absolute;right:-3px;top:-4px;min-width:18px;height:18px;padding:0 4px;border-radius:10px;background:#c92525;color:#fff;font-size:10px;line-height:18px;font-weight:800} .notification-center{position:fixed;right:16px;top:66px;width:min(420px,calc(100vw - 24px));max-height:calc(100vh - 84px);z-index:160;background:#fff;border:1px solid #ddd;border-radius:14px;box-shadow:0 16px 50px rgba(0,0,0,.2);display:none;overflow:hidden} .notification-center.open{display:block} .notification-center-head{display:flex;justify-content:space-between;align-items:center;padding:14px;border-bottom:1px solid #eee} .notification-center-actions{padding:8px 12px;display:flex;gap:7px;border-bottom:1px solid #eee} .notification-list{max-height:calc(100vh - 190px);overflow:auto} .notification-item{display:flex;gap:10px;padding:13px;border-bottom:1px solid #eee;cursor:pointer;background:#fff} .notification-item.unread{background:#f6f9ff}.notification-item:hover{background:#f5f5f5} .notification-dot{width:8px;height:8px;border-radius:50%;background:#aaa;margin-top:6px;flex:0 0 auto} .notification-item.severity-warning .notification-dot{background:#d99c00}.notification-item.severity-danger .notification-dot{background:#c92525}.notification-item.severity-success .notification-dot{background:#32834b}.notification-item.severity-info .notification-dot{background:#3b6ecb} .notification-body{min-width:0;flex:1}.notification-title-row{display:flex;justify-content:space-between;gap:8px}.notification-title-row span{font-size:10px;color:#888;white-space:nowrap}.notification-message{font-size:12px;color:#555;line-height:1.45;margin-top:4px}.notification-action{margin-top:7px;border:0;background:transparent;padding:0;color:#315ea8;font-weight:700;font-size:11px;cursor:pointer} .notification-backdrop{display:none;position:fixed;inset:0;z-index:150;background:rgba(0,0,0,.08)}.notification-backdrop.open{display:block} .saas-notification-admin-card{margin:14px 0;border-color:#c9d7ee!important} @media(max-width:760px){.desktop-notification-bell{display:none}.mobile-notification-bell{display:block;width:38px;height:38px;box-shadow:none;background:transparent}.notification-center{top:58px;right:8px;width:calc(100vw - 16px);max-height:calc(100vh - 70px)}.notification-list{max-height:calc(100vh - 180px)}} /* V3.37.1 Stable - system transactional email */ .saas-email-system-card{margin:14px 0;border-color:#cbd8cb!important;background:#fbfdfb!important} /* V3.37.1 Stable - fabric order progress selector */ .order-status-select, .order-status-select.status-shipping, .order-status-select.status-stocked{ background:#fff!important; color:#202020!important; border:1px solid rgba(0,0,0,.24)!important; border-radius:7px!important; box-shadow:0 1px 2px rgba(0,0,0,.04)!important; } .order-status-select:hover{border-color:rgba(0,0,0,.42)!important} .order-status-select:focus{outline:none!important;border-color:rgba(0,0,0,.55)!important;box-shadow:0 0 0 2px rgba(0,0,0,.06)!important} .order-status-select.is-saving{opacity:.62;cursor:wait} /* V3.37.1 Stable - bulk fabric debt payment */ .bulk-fabric-payment-dialog{width:min(96vw,1200px)!important;max-width:1200px!important} .bulk-fabric-toolbar{display:flex;gap:7px;margin:10px 0} #bulkFabricPaymentOrders{overflow-x:auto} #bulkFabricPaymentOrders table{min-width:900px} #bulkFabricPaymentOrders .bulk-fabric-amount{min-width:135px;text-align:right} .bulk-fabric-summary{grid-template-columns:repeat(2,minmax(180px,1fr))!important;margin-top:12px} @media(max-width:600px){.bulk-fabric-summary{grid-template-columns:1fr!important}} /* Thanh toán gộp thành phẩm: giữ cuộn trong popup, không cuộn trang nền. */ #fgBulkPaymentModal{overscroll-behavior:contain} #fgBulkPaymentModal .dialog{max-height:94vh;overflow-y:auto;overscroll-behavior:contain;scrollbar-gutter:stable} #fgBulkPaymentRows{max-height:48vh;overflow:auto;overscroll-behavior:contain} #fgBulkPaymentRows table{min-width:1150px} /* V3.37.1 Stable - accessory product create + default price */ #accessoryProductModal #accessoryProductUnitPrice{font-weight:750;text-align:right} #accessoryInventoryTable td[data-price]{white-space:nowrap} /* V3.37.1 Stable - fabric order status */ .order-status-select.status-shipping{ background:#fff!important; color:#0b4fa3!important; border:1px solid rgba(0,0,0,.24)!important; } .order-status-select.status-stocked{ background:#fff!important; color:#16733a!important; border:1px solid rgba(0,0,0,.24)!important; } /* Notification bell removed from operational UI */ .notification-bell,.notification-center,.notification-backdrop{display:none!important} /* V3.37.1 Stable - SaaS-controlled Data & Backup access */ .saas-feature-toggle{display:inline-flex;align-items:center;gap:7px;white-space:nowrap;font-weight:750;font-size:12px} .saas-feature-toggle input{width:18px;height:18px;accent-color:#111} .saas-feature-toggle span{min-width:26px} /* V3.37.1 Stable - Purchase document row detail */ .purchase-report-data-row{cursor:pointer} .purchase-report-data-row:hover{background:#f7f8fa!important} .purchase-report-data-row:focus{outline:2px solid rgba(20,20,20,.18);outline-offset:-2px} .purchase-report-data-row button, .purchase-report-data-row input, .purchase-report-data-row select{cursor:pointer} /* V3.37.1 Stable - accessory quantity calculation */ #accessoryOrderModal .ao-direct-qty, #accessoryOrderModal .ao-color-qty{ font-variant-numeric:tabular-nums; text-align:center; } /* V3.37.1 Stable - fabric inventory value */ #inventoryTable td[data-price], #productsTable td[data-price]{white-space:nowrap;font-weight:800} /* V3.37.1 Stable - instant/optimistic operations */ .accessory-order-save-btn:disabled{opacity:.65} /* V3.37.1 Stable - Print Template Studio */ .print-template-help code{font-weight:800} .print-variable-chips{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:12px} .print-variable-chip{display:flex;flex-direction:column;align-items:flex-start;gap:3px;padding:9px 10px;border:1px solid var(--line);border-radius:8px;background:#fff;cursor:pointer;text-align:left} .print-variable-chip:hover{border-color:#888;background:#fafafa}.print-variable-chip code{font-size:12px}.print-variable-chip span{font-size:10px;color:var(--muted)} .print-template-layout{display:grid;grid-template-columns:260px minmax(0,1fr);gap:14px;align-items:start} .print-template-list-card{position:sticky;top:12px}.print-template-tab{width:100%;display:flex;flex-direction:column;align-items:flex-start;gap:4px;border:1px solid var(--line);background:#fff;border-radius:9px;padding:12px;margin:0 0 8px;cursor:pointer;text-align:left}.print-template-tab span{font-size:10px;color:var(--muted)}.print-template-tab.active{background:#151515;color:#fff;border-color:#151515}.print-template-tab.active span{color:#bbb} .print-editor-section{border-top:1px solid var(--line);padding-top:15px;margin-top:15px}.print-editor-section h3{font-size:14px;margin:0 0 12px} .print-dynamic-lines{display:flex;flex-direction:column;gap:7px;margin:10px 0}.print-dynamic-line{display:grid;grid-template-columns:30px minmax(0,1fr) auto;gap:7px;align-items:center}.print-dynamic-index{display:flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:7px;background:#eee;font-size:11px;font-weight:800}.print-dynamic-input{width:100%} @media(max-width:1000px){.print-template-layout{grid-template-columns:1fr}.print-template-list-card{position:relative;top:auto}.print-variable-chips{grid-template-columns:repeat(2,minmax(0,1fr))}} @media(max-width:600px){.print-variable-chips{grid-template-columns:1fr}} /* V3.34.23 */ .accessory-order-financial-strip{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px;margin:12px 0}.accessory-order-financial-strip>div{background:#f7f7f5;border:1px solid var(--line);border-radius:9px;padding:10px}.accessory-order-financial-strip span{display:block;font-size:10px;color:var(--muted);margin-bottom:5px}.accessory-order-invoice-section{margin:14px 0;padding:14px;border:1px solid var(--line);border-radius:10px;background:#fafafa}.ao-actual-cost-wrap{background:#fffdf4!important;border:1px solid #e7d8aa!important;border-radius:7px;padding:7px!important}@media(max-width:1000px){.accessory-order-financial-strip{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:600px){.accessory-order-financial-strip{grid-template-columns:1fr 1fr}} /* V3.37.1 Stable - Đơn đặt phụ liệu đồng bộ cấu trúc/màu với Đơn đặt vải */ #accessoryOrderModal{ padding:10px!important; } #accessoryOrderModal .accessory-order-editor-dialog{ width:min(99vw,1620px)!important; max-width:1620px!important; max-height:98vh!important; padding:0!important; overflow:auto!important; border-radius:15px!important; background:#f8fafc!important; } /* Phần thông tin chung đồng bộ Đơn đặt vải */ #accessoryOrderModal .accessory-order-editor-head{ padding:12px 18px 8px!important; } #accessoryOrderModal .accessory-order-title-line h2{ color:#10254d!important; font-size:25px!important; font-weight:900!important; } #accessoryOrderModal .accessory-order-info-card{ margin:0 16px 10px!important; background:#fff!important; border:1px solid #d8dde6!important; border-radius:9px!important; padding:11px 14px!important; box-shadow:0 1px 3px rgba(0,0,0,.025)!important; } #accessoryOrderModal .accessory-order-info-grid{ gap:8px 18px!important; } #accessoryOrderModal .accessory-order-info-grid label{ font-size:11px!important; font-weight:800!important; color:#566176!important; } #accessoryOrderModal .accessory-order-info-grid input, #accessoryOrderModal .accessory-order-info-grid select, #accessoryOrderModal .accessory-order-info-grid textarea{ min-height:36px!important; border-radius:6px!important; } /* Bỏ kiểu bảng cứng gây lệch cột. Mỗi phụ liệu trở thành 1 card như 1 loại vải */ #accessoryOrderModal .accessory-order-editor-table{ width:auto!important; margin:0 16px!important; border:0!important; border-radius:0!important; background:transparent!important; overflow:visible!important; } #accessoryOrderModal .accessory-order-table-head{ display:none!important; } #accessoryOrderModal .accessory-order-table-row{ display:grid!important; grid-template-columns: 48px minmax(300px,1.65fr) minmax(150px,.75fr) minmax(150px,.75fr) minmax(150px,.75fr) minmax(190px,1fr) 88px!important; grid-template-areas: "stt product unit qty price total action" "stt class class class convert convert action" "fees fees fees fees fees fees fees"!important; gap:0!important; min-width:0!important; width:100%!important; min-height:0!important; margin:0 0 10px!important; border:1px solid #d6dce5!important; border-radius:9px!important; overflow:hidden!important; background:#fff!important; box-sizing:border-box!important; align-items:stretch!important; } #accessoryOrderModal .ao-stt{grid-area:stt!important} #accessoryOrderModal .ao-product-cell{grid-area:product!important} #accessoryOrderModal .ao-unit-cell{grid-area:unit!important} #accessoryOrderModal .ao-class-cell{grid-area:class!important} #accessoryOrderModal .ao-qty-cell{grid-area:qty!important} #accessoryOrderModal .ao-price-cell{grid-area:price!important} #accessoryOrderModal .ao-convert-cell{grid-area:convert!important} #accessoryOrderModal .ao-total-cell{grid-area:total!important} #accessoryOrderModal .ao-action-cell{grid-area:action!important} #accessoryOrderModal .ao-import-fees{grid-area:fees!important} /* Ô dữ liệu: label trên - input dưới, cùng nhịp với form đơn vải */ #accessoryOrderModal .ao-cell{ position:relative!important; display:flex!important; flex-direction:column!important; align-items:stretch!important; justify-content:flex-start!important; gap:5px!important; min-width:0!important; width:100%!important; padding:22px 10px 8px!important; border-right:1px solid #eef0f3!important; background:#fff!important; text-align:left!important; box-sizing:border-box!important; } #accessoryOrderModal .ao-cell::before{ position:absolute; top:7px; left:10px; right:10px; font-size:10.5px; line-height:1; font-weight:800; color:#566176; text-align:left; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } #accessoryOrderModal .ao-product-cell::before{content:"Phụ liệu"} #accessoryOrderModal .ao-unit-cell::before{content:"ĐVT đặt"} #accessoryOrderModal .ao-class-cell::before{content:"Phân loại / Số lượng"} #accessoryOrderModal .ao-qty-cell::before{content:"Tổng số lượng"} #accessoryOrderModal .ao-price-cell::before{content:"Đơn giá"} #accessoryOrderModal .ao-convert-cell::before{content:"Quy đổi nhập kho"} #accessoryOrderModal .ao-total-cell::before{content:"Tổng quy đổi"} #accessoryOrderModal .ao-action-cell::before{content:"Thao tác"} #accessoryOrderModal .ao-stt{ padding:0!important; align-items:center!important; justify-content:center!important; background:#f8fafc!important; color:#10254d!important; font-size:15px!important; font-weight:900!important; border-right:1px solid #e3e7ed!important; } #accessoryOrderModal .ao-stt::before{display:none!important} #accessoryOrderModal .ao-cell input, #accessoryOrderModal .ao-cell select{ width:100%!important; min-width:0!important; max-width:100%!important; height:36px!important; min-height:36px!important; border-radius:6px!important; padding:7px 9px!important; font-size:13px!important; text-align:left!important; text-align-last:left!important; box-sizing:border-box!important; } #accessoryOrderModal .ao-price-cell input, #accessoryOrderModal .ao-qty-cell input{ text-align:right!important; font-variant-numeric:tabular-nums!important; font-weight:700!important; } #accessoryOrderModal .ao-unit-cell .ao-base-preview{ margin-top:2px!important; font-size:10px!important; line-height:1.25!important; color:#667085!important; text-align:left!important; } /* Phân loại giống các card màu của Đơn đặt vải */ #accessoryOrderModal .ao-class-cell{ border-top:1px solid #eef0f3!important; padding-top:25px!important; background:#fbfcfe!important; } #accessoryOrderModal .accessory-order-colors{ display:flex!important; flex-wrap:wrap!important; gap:7px!important; width:100%!important; overflow:visible!important; justify-content:flex-start!important; } #accessoryOrderModal .accessory-order-color-row{ width:auto!important; min-width:92px!important; display:flex!important; flex-direction:column!important; align-items:stretch!important; padding:6px 7px!important; border:1px solid #dbe0e8!important; border-radius:7px!important; background:#fff!important; } #accessoryOrderModal .ao-class-label{ min-height:0!important; margin:0 0 4px!important; font-size:10.5px!important; font-weight:800!important; color:#465166!important; text-align:left!important; } #accessoryOrderModal .accessory-order-color-row .ao-color-qty{ width:100%!important; min-width:78px!important; height:31px!important; text-align:center!important; padding:5px 6px!important; } #accessoryOrderModal .accessory-no-color-label{ margin-top:7px!important; text-align:left!important; color:#667085!important; } /* Tổng quy đổi dùng xanh nhạt giống Tổng của Đơn đặt vải */ #accessoryOrderModal .ao-total-cell{ justify-content:center!important; background:#eef6ff!important; color:#164f9d!important; border-left:1px solid #b9d6ff!important; border-right:1px solid #b9d6ff!important; font-size:13px!important; font-weight:900!important; } #accessoryOrderModal .ao-total-cell::before{ color:#1559c7!important; } #accessoryOrderModal .accessory-item-total{ width:100%!important; text-align:right!important; font-size:14px!important; color:#164f9d!important; } #accessoryOrderModal .ao-convert-cell{ border-top:1px solid #eef0f3!important; background:#fbfcfe!important; } #accessoryOrderModal .ao-conversion-display{ width:100%!important; text-align:left!important; font-size:11.5px!important; line-height:1.4!important; } /* Nút xóa cùng vị trí ổn định, không kéo lệch các ô */ #accessoryOrderModal .ao-action-cell{ align-items:center!important; justify-content:center!important; border-left:1px solid #eef0f3!important; } #accessoryOrderModal .ao-action-cell .btn{ width:auto!important; min-width:62px!important; padding:7px 10px!important; } /* Chi phí nhập khẩu tách thành panel dưới giống phần chi phí của Đơn vải */ #accessoryOrderModal .ao-import-fees{ width:100%!important; display:grid!important; grid-template-columns:repeat(4,minmax(0,1fr))!important; gap:14px!important; padding:8px 12px 10px!important; margin:0!important; border-top:1px solid #dfe3ea!important; background:#fff!important; box-sizing:border-box!important; } #accessoryOrderModal .ao-import-fees>div{ display:flex!important; flex-direction:column!important; align-items:stretch!important; gap:4px!important; min-width:0!important; padding:0!important; background:transparent!important; border:0!important; } #accessoryOrderModal .ao-import-fees>div>span{ font-size:10.5px!important; font-weight:800!important; color:#566176!important; text-align:left!important; } #accessoryOrderModal .ao-import-fees input{ width:100%!important; min-width:0!important; height:32px!important; border-radius:6px!important; text-align:right!important; font-variant-numeric:tabular-nums!important; } #accessoryOrderModal .ao-actual-cost-wrap{ background:#fffdf4!important; border:1px solid #e7d8aa!important; border-radius:7px!important; padding:6px 8px!important; } /* Dòng tổng tài chính đồng bộ palette đơn vải */ #accessoryOrderModal .accessory-order-financial-strip{ grid-template-columns:repeat(6,minmax(0,1fr))!important; gap:14px!important; margin:10px 16px!important; } #accessoryOrderModal .accessory-order-financial-strip>div{ min-height:75px!important; display:flex!important; flex-direction:column!important; justify-content:center!important; background:#fff!important; border:1px solid #d6dce5!important; border-radius:9px!important; padding:13px 16px!important; } #accessoryOrderModal .accessory-order-financial-strip>div:last-child{ background:#f4f8ff!important; border-color:#83aff8!important; } #accessoryOrderModal .accessory-order-financial-strip>div:last-child span, #accessoryOrderModal .accessory-order-financial-strip>div:last-child strong{ color:#1559c7!important; } #accessoryOrderModal .accessory-order-financial-strip span{ font-size:10.5px!important; color:#667085!important; margin-bottom:5px!important; } #accessoryOrderModal .accessory-order-financial-strip strong{ font-size:18px!important; color:#101828!important; } #accessoryOrderModal .accessory-order-calc-cards{ grid-template-columns:repeat(5,minmax(0,1fr))!important; gap:14px!important; margin:10px 16px!important; } #accessoryOrderModal .accessory-order-calc-cards .card{ min-height:75px!important; padding:13px 16px!important; border-radius:9px!important; } /* Khối VAT phía dưới dùng cùng màu/chất liệu form đơn vải */ #accessoryOrderModal .accessory-order-invoice-section{ margin:10px 16px 12px!important; padding:11px 14px!important; background:#fff!important; border:1px solid #d8dde6!important; border-radius:9px!important; } #accessoryOrderModal .accessory-order-invoice-section .section-title{ margin-bottom:8px!important; } /* Footer giống đơn vải */ #accessoryOrderModal .accessory-order-list-footer{ min-width:0!important; width:100%!important; padding:9px 12px!important; background:#fff!important; border-top:1px solid #d7dde7!important; } #accessoryOrderModal .accessory-order-editor-footer{ padding:9px 18px!important; background:#fff!important; border-top:1px solid #d6dce6!important; box-shadow:0 -3px 12px rgba(20,35,60,.04)!important; } @media(max-width:1200px){ #accessoryOrderModal .accessory-order-table-row{ grid-template-columns:48px minmax(260px,1.5fr) 140px 145px 145px minmax(180px,1fr) 82px!important; overflow-x:auto!important; } #accessoryOrderModal .accessory-order-financial-strip{ grid-template-columns:repeat(3,minmax(0,1fr))!important; } #accessoryOrderModal .accessory-order-calc-cards{ grid-template-columns:repeat(3,minmax(0,1fr))!important; } } @media(max-width:760px){ #accessoryOrderModal .accessory-order-editor-table{ margin-left:8px!important; margin-right:8px!important; } #accessoryOrderModal .accessory-order-table-row{ display:flex!important; flex-direction:column!important; } #accessoryOrderModal .ao-stt{ min-height:38px!important; } #accessoryOrderModal .ao-cell{ border-right:0!important; border-bottom:1px solid #eef0f3!important; } #accessoryOrderModal .ao-import-fees{ grid-template-columns:1fr!important; } #accessoryOrderModal .accessory-order-financial-strip, #accessoryOrderModal .accessory-order-calc-cards{ grid-template-columns:1fr!important; margin-left:8px!important; margin-right:8px!important; } #accessoryOrderModal .accessory-order-invoice-section{ margin-left:8px!important; margin-right:8px!important; } } /* V3.37.1 Stable - editable print company */ #pteCompanyName{font-weight:800} /* V3.37.1 Stable */ #accessoryOrderModal .ao-cell input,#accessoryOrderModal .ao-cell select,#accessoryOrderModal .accessory-order-color-row .ao-color-qty,#accessoryOrderModal .ao-import-fees input,#accessoryOrderModal .accessory-item-actual-cost-row input{background:#fff!important;border:1px solid rgba(0,0,0,.24)!important;color:#20242b!important;box-shadow:0 1px 2px rgba(0,0,0,.03)!important} #accessoryOrderModal .ao-cell input:focus,#accessoryOrderModal .ao-cell select:focus,#accessoryOrderModal .ao-import-fees input:focus,#accessoryOrderModal .accessory-item-actual-cost-row input:focus{background:#fff!important;border-color:rgba(0,0,0,.5)!important;outline:none!important;box-shadow:0 0 0 2px rgba(0,0,0,.05)!important} #accessoryOrderModal .ao-import-fees{grid-template-columns:repeat(4,minmax(0,1fr))!important;background:#fff!important;padding:9px 12px 8px!important} #accessoryOrderModal .ao-import-fees>div{display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:4px!important}.ao-import-tax-preview{font-size:9.5px!important;color:#667085!important;margin-top:3px} #accessoryOrderModal .accessory-item-financial-line{grid-column:1/-1!important;display:flex!important;align-items:center!important;gap:8px 14px!important;flex-wrap:wrap!important;padding:8px 12px!important;border-top:1px solid #dfe3ea!important;background:#eef6ff!important;color:#164f9d!important;font-size:11px!important;line-height:1.45!important} #accessoryOrderModal .accessory-item-financial-line span{white-space:nowrap}.accessory-item-actual-payable{margin-left:auto;padding-left:14px;border-left:1px solid #b9d6ff} #accessoryOrderModal .accessory-item-actual-cost-row{grid-column:1/-1!important;display:flex!important;align-items:center!important;justify-content:space-between!important;gap:16px!important;padding:9px 12px 10px!important;border-top:1px solid #dfe3ea!important;background:#fff!important}.accessory-item-actual-cost-row .small{font-size:10.5px!important;color:#667085!important;margin-top:2px}.accessory-item-actual-cost-input{display:flex!important;align-items:center!important;gap:7px!important;min-width:310px}.accessory-item-actual-cost-input input{width:190px!important;height:34px!important;text-align:right!important;font-weight:700!important}.accessory-item-actual-cost-input span{white-space:nowrap;font-size:11px;color:#566176} #accessoryOrderModal .accessory-order-vat-card{margin:10px 16px 12px!important;min-height:75px!important;padding:13px 16px!important;border-radius:9px!important;background:#fff!important;border:1px solid #d6dce5!important}.accessory-order-vat-input{display:flex;align-items:center;gap:8px;margin-top:7px;max-width:200px}.accessory-order-vat-input input{width:120px;height:36px;text-align:center;background:#fff!important;border:1px solid rgba(0,0,0,.24)!important;border-radius:6px}.accessory-order-vat-input span{font-weight:800} @media(max-width:850px){#accessoryOrderModal .ao-import-fees{grid-template-columns:1fr!important}.accessory-item-financial-line{flex-direction:column!important;align-items:flex-start!important}.accessory-item-actual-payable{margin-left:0;padding-left:0;border-left:0}.accessory-item-actual-cost-row{flex-direction:column!important;align-items:stretch!important}.accessory-item-actual-cost-input{min-width:0!important}} /* V3.37.1 Stable - save bar + accessory totals */ #orderModal .fabric-order-editor-footer{ display:flex!important; visibility:visible!important; opacity:1!important; position:sticky!important; bottom:0!important; z-index:120!important; min-height:58px!important; flex-shrink:0!important; } #orderModal .fabric-order-save-btn{ display:inline-flex!important; visibility:visible!important; align-items:center!important; justify-content:center!important; } #accessoryOrderModal .accessory-order-financial-strip{ grid-template-columns:repeat(6,minmax(0,1fr))!important; } #accessoryOrderModal .accessory-order-financial-strip>div{ min-height:78px!important; } #accessoryOrderModal .accessory-vat-inline-input{ display:flex!important; align-items:center!important; gap:6px!important; margin-top:2px!important; } #accessoryOrderModal .accessory-vat-inline-input input{ width:92px!important; height:34px!important; min-height:34px!important; background:#fff!important; border:1px solid rgba(0,0,0,.24)!important; border-radius:6px!important; padding:5px 8px!important; text-align:center!important; font-weight:800!important; } #accessoryOrderModal .accessory-vat-inline-input b{ font-size:12px!important; } @media(max-width:1200px){ #accessoryOrderModal .accessory-order-financial-strip{grid-template-columns:repeat(3,minmax(0,1fr))!important} } @media(max-width:700px){ #accessoryOrderModal .accessory-order-financial-strip{grid-template-columns:1fr!important} } /* V3.37.1 Stable - trong nước tuyệt đối không hiện Giá thực tế */ #accessoryOrderModal.accessory-domestic-mode .accessory-item-actual-cost-row, #accessoryOrderModal.accessory-domestic-mode .ao-import-fees, #accessoryOrderModal.accessory-domestic-mode .accessory-item-financial-line{ display:none!important; } /* V3.37.1 Stable - Lưu/Hủy phụ liệu đặt trực tiếp trong bảng như Đơn đặt vải */ #accessoryOrderModal .accessory-order-editor-footer{display:none!important} #accessoryOrderModal .accessory-order-inline-savebar{ position:sticky!important; bottom:0!important; z-index:120!important; display:flex!important; align-items:center!important; justify-content:space-between!important; gap:16px!important; min-height:58px!important; margin:12px 0 0!important; padding:9px 18px!important; background:#fff!important; border-top:1px solid #d6dce6!important; box-shadow:0 -3px 12px rgba(20,35,60,.05)!important; visibility:visible!important; opacity:1!important; } #accessoryOrderModal .accessory-order-inline-savebar .accessory-order-footer-summary{ font-size:12px!important; color:#536078!important; } #accessoryOrderModal .accessory-order-inline-savebar .accessory-order-footer-actions{ display:flex!important; align-items:center!important; gap:10px!important; } #accessoryOrderModal .accessory-order-inline-savebar .btn{ display:inline-flex!important; align-items:center!important; justify-content:center!important; min-height:40px!important; visibility:visible!important; opacity:1!important; } #accessoryOrderModal #accessoryOrderSaveButton{ min-width:142px!important; font-weight:900!important; } @media(max-width:700px){ #accessoryOrderModal .accessory-order-inline-savebar{ flex-direction:column!important; align-items:flex-start!important; padding:9px 12px!important; } #accessoryOrderModal .accessory-order-inline-savebar .accessory-order-footer-actions{ width:100%!important; justify-content:flex-end!important; } } /* V3.37.1 Stable - print company multiline/right aligned */ #pteCompanyName{ min-height:78px!important; resize:vertical!important; font-weight:800!important; line-height:1.45!important; white-space:pre-wrap!important; } /* V3.37.1 Stable - click row to view fabric order */ #ordersTable .order-data-row{cursor:pointer} #ordersTable .order-data-row:hover td{background:#f7f8fa!important} #ordersTable .order-data-row:focus{outline:2px solid rgba(17,24,39,.18);outline-offset:-2px} #detailModal{z-index:220!important} .finished-goods-receipt-panel{max-width:none!important}.fgr-top{margin-bottom:10px}.fgr-save-state{font-size:12px;font-weight:800;padding:7px 11px;border-radius:999px;background:#ecfdf3;color:#067647}.fgr-save-state.saving{background:#eff8ff;color:#175cd3}.fgr-toolbar{position:sticky;top:0;z-index:18;background:var(--bg);padding:8px 0 10px;border-bottom:1px solid #d9dde5}.fgr-toolbar-actions,.fgr-filters{display:flex;gap:7px;align-items:center;flex-wrap:wrap}.fgr-filters{margin-top:8px}.fgr-filters input,.fgr-filters select{height:36px;padding:6px 9px;border:1px solid #cfd4dc;border-radius:6px;background:#fff;min-width:140px}.fgr-filters #fgrSearch{min-width:310px;flex:1}.fgr-summary{display:grid;grid-template-columns:repeat(4,minmax(130px,1fr));gap:8px;margin:10px 0}.fgr-summary>div{background:#fff;border:1px solid #d9dde5;border-radius:8px;padding:9px 12px}.fgr-summary span{display:block;font-size:10px;color:#667085}.fgr-summary strong{font-size:18px}.fgr-table-wrap{overflow:auto;max-height:calc(100vh - 250px);background:#fff;border:1px solid #cfd5df;border-radius:8px}.fgr-table{border-collapse:separate!important;border-spacing:0!important;min-width:3000px!important;font-size:11px!important}.fgr-table th,.fgr-table td{border-right:1px solid #e1e5ea!important;border-bottom:1px solid #e1e5ea!important;padding:4px!important;vertical-align:middle!important;background:#fff}.fgr-table tbody tr:nth-child(even) td{background:#fafafa}.fgr-table thead th{position:sticky;z-index:12;text-align:center!important;font-weight:800!important}.fgr-group-head th{top:0;height:34px}.fgr-column-head th{top:34px;height:48px}.fgr-kho-head{background:#dcecff!important;color:#134d96!important}.fgr-accounting-head{background:#dcf6e9!important;color:#087443!important}.fgr-column-head th{background:#f5f7fa!important;color:#344054!important}.fgr-receipt-start td{border-top:3px solid #31b7aa!important}.fgr-sticky-1{position:sticky!important;left:30px;z-index:8;background:inherit!important;min-width:120px}.fgr-sticky-2{position:sticky!important;left:150px;z-index:8;background:inherit!important;min-width:180px}.fgr-sticky-3{position:sticky!important;left:330px;z-index:8;background:inherit!important;min-width:240px}.fgr-select-col{width:30px;min-width:30px;position:sticky;left:0;z-index:9}.fgr-cell-input{width:100%;min-width:72px;height:31px;border:1px solid transparent;background:transparent;border-radius:4px;padding:4px 5px;font-size:11px}.fgr-cell-input:hover{border-color:#cfd4dc;background:#fff}.fgr-cell-input:focus{outline:none;border:2px solid #2684ff!important;background:#fff!important;box-shadow:0 0 0 1px rgba(38,132,255,.15)}.fgr-left{text-align:left!important}.fgr-number{text-align:center!important;min-width:60px}.fgr-size-cell{min-width:66px}.fgr-na{color:#bbb}.fgr-total-cell,.fgr-total-code{text-align:center!important;min-width:90px}.fgr-warning{font-size:9px;color:#b42318;font-weight:800}.fgr-link-production{border:0;background:transparent;color:#175cd3;font-weight:800;cursor:pointer;white-space:normal}.fgr-link-production.done{color:#067647}.fgr-status-pending{color:#175cd3!important;font-weight:800}.fgr-status-ok{color:#067647!important;font-weight:800}.fgr-doc-actions,.fgr-doc-input{display:flex;gap:3px;align-items:center}.fgr-doc-actions button,.fgr-doc-input button,.fgr-mini-attach,.fgr-actions button{border:1px solid #d0d5dd;background:#fff;border-radius:4px;cursor:pointer;padding:3px 5px}.fgr-doc-count{font-size:9px;background:#eef2f6;border-radius:99px;padding:2px 5px}.fgr-actions{white-space:nowrap}.fgr-actions button:last-child{color:#b42318} #fgrReceiptModal{z-index:260!important}.fgr-receipt-editor-dialog{width:min(1500px,98vw)!important;padding:0!important;overflow:hidden!important}.fgr-receipt-editor-head{display:flex;justify-content:space-between;gap:16px;align-items:flex-start;padding:18px 20px;border-bottom:1px solid #d9dde5;background:#fff}.fgr-receipt-editor-head h2{margin:0 0 4px;font-size:22px}.fgr-receipt-editor-body{padding:16px 20px;max-height:calc(94vh - 142px);overflow:auto;background:#f7f8fa}.fgr-receipt-info{background:#fff;border:1px solid #d9dde5;border-radius:10px;padding:14px;margin-bottom:14px}.fgr-receipt-info h3{margin:0 0 12px;font-size:14px}.fgr-receipt-info-grid{display:grid;grid-template-columns:1fr 1fr 2fr 2fr;gap:10px;align-items:end}.fgr-receipt-info-grid .field{min-width:0}.fgr-receipt-info-grid .field label{min-height:16px}.fgr-receipt-info-grid input,.fgr-receipt-info-grid select{width:100%;height:40px;box-sizing:border-box}.fgr-receipt-lines-card{background:#fff;border:1px solid #d9dde5;border-radius:10px;overflow:hidden}.fgr-receipt-lines-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 14px;border-bottom:1px solid #e1e5ea}.fgr-receipt-lines-wrap{overflow:auto}.fgr-receipt-editor-table{border-collapse:collapse;table-layout:fixed}.fgr-receipt-editor-table th{background:#f2f4f7;text-align:center!important;vertical-align:middle!important;font-size:11px;line-height:1.2;height:42px;padding:6px}.fgr-receipt-editor-table td{padding:8px 6px;border-bottom:1px solid #e8ebef;text-align:center;vertical-align:middle!important;overflow:hidden}.fgr-receipt-editor-table select,.fgr-receipt-editor-table input{display:block;width:100%!important;min-width:0!important;height:38px;box-sizing:border-box;border:1px solid #cfd4dc;border-radius:6px;padding:6px 7px;background:#fff}.fgr-receipt-editor-table .fgr-editor-total,.fgr-receipt-editor-table .fgr-editor-code-total{text-align:center;font-size:15px}.fgr-receipt-editor-table .fgr-editor-product,.fgr-receipt-editor-table .fgr-editor-color{text-align:left}.fgr-editor-size-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.fgr-editor-size-row{display:grid;grid-template-columns:42px 1fr;gap:5px;align-items:center;font-size:11px;font-weight:800;color:#475467}.fgr-editor-size-row input{height:34px!important;text-align:center}.fgr-add-color-btn{display:block;width:100%;margin-top:6px;height:32px!important}.fgr-receipt-editor-table td:last-child .btn{height:38px;min-width:58px;padding:6px 9px}.fgr-receipt-editor-footer{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:12px 20px;border-top:1px solid #d9dde5;background:#fff}.fgr-receipt-editor-summary{font-weight:800}.fgr-receipt-editor-actions{display:flex;gap:8px}.fgr-editor-empty{padding:24px;text-align:center;color:#667085} @media(max-width:900px){.fgr-summary{grid-template-columns:repeat(2,minmax(120px,1fr))}.fgr-table-wrap{max-height:calc(100vh - 320px)}.fgr-filters #fgrSearch{min-width:100%;width:100%}} @media(max-width:900px){.fgr-receipt-info-grid{grid-template-columns:1fr 1fr}.fgr-receipt-editor-dialog{width:calc(100vw - 12px)!important}.fgr-receipt-editor-body{padding:10px}.fgr-receipt-editor-head,.fgr-receipt-editor-footer{padding:12px}} @media(max-width:600px){.fgr-toolbar-actions .btn{font-size:11px;padding:7px 8px}.fgr-filters>*{min-width:calc(50% - 4px)!important}.fgr-summary{grid-template-columns:1fr 1fr}.fgr-receipt-info-grid{grid-template-columns:1fr}.fgr-receipt-editor-footer{align-items:stretch;flex-direction:column}.fgr-receipt-editor-actions .btn{flex:1}} /* V3.37.1 Stable - menu riêng + production interaction hardening */ #productionModal,#productionDetailModal,#productionReturnModal,#productionCostModal{z-index:260} #productionTable .production-data-row{cursor:pointer} #productionTable .production-data-row:hover td{background:#f7f9fc!important} #productionTable .production-data-row:focus{outline:2px solid rgba(23,92,211,.28);outline-offset:-2px} #production .top{position:relative;z-index:2} #production .top .production-action{position:relative;z-index:3;pointer-events:auto} /* V3.37.1 Stable - interaction recovery */ #productionTable .production-data-row, #ordersTable .order-data-row{pointer-events:auto!important} .panel.active{pointer-events:auto!important} .modal{pointer-events:auto} .modal:not(.open){display:none!important} /* V3.37.1 Stable - khôi phục tương tác toàn hệ thống */ body:not(.logged-out) .modal:not(.open){display:none!important;pointer-events:none!important;visibility:hidden!important} body:not(.logged-out) .notification-backdrop:not(.open), body:not(.logged-out) .orders-date-filter-portal:not(.open), body:not(.logged-out) .mobile-date-filter-backdrop{pointer-events:none!important} body:not(.logged-out) .panel.active{pointer-events:auto!important} /* V3.37.1 Stable - interaction permission repair */ body:not(.logged-out) .panel.active button:not([style*="display: none"]){pointer-events:auto} /* V3.37.1 Stable - modal open state root fix */ body:not(.logged-out) .modal:not(.open){ display:none!important; pointer-events:none!important; visibility:hidden!important; opacity:0!important; } body:not(.logged-out) .modal.open{ display:flex!important; pointer-events:auto!important; visibility:visible!important; opacity:1!important; } /* V3.37.1 Stable - frontend interaction recovery */ body:not(.logged-out) .panel.active{pointer-events:auto!important} body:not(.logged-out) .panel.active button:not(:disabled){pointer-events:auto!important} #ordersTable .order-data-row,#productionTable .production-data-row{pointer-events:auto!important;cursor:pointer!important} .fgr-editor-size-list{display:flex!important;align-items:center;gap:7px;flex-wrap:nowrap!important;overflow-x:auto}.fgr-editor-size-row{display:grid!important;grid-template-columns:38px 72px!important;gap:4px;align-items:center;flex:0 0 auto}.fgr-receipt-editor-table td[rowspan]{vertical-align:middle!important;background:#fff!important} .fgr-readonly-table th,.fgr-readonly-table td{text-align:center!important}.fgr-readonly-table thead th{top:0!important;height:46px!important;background:#f5f5f5!important;color:#333!important;border-bottom:1px solid #d8d8d8!important}.fgr-readonly-table .order-data-row:hover td{background:#f7f8fa!important}.fgr-readonly-table td{border-bottom:1px solid #e5e7eb!important}.fgr-quick-status{min-width:118px;padding:6px 9px;border:1px solid #e0b36b;border-radius:7px;background:#fff8eb;color:#9a5b00;font-size:11px;font-weight:800;cursor:pointer}.fgr-quick-status:hover{filter:brightness(.97);border-color:#bd7b18}.fgr-quick-status.done{border-color:#9fceb0;background:#eaf7ee;color:#237a3b} .fgr-receipt-editor-table .fgr-editor-actions-cell{display:flex;align-items:center;justify-content:center;gap:6px;min-height:54px;overflow:visible}.fgr-receipt-editor-table .fgr-editor-actions-cell .btn{width:auto!important;min-width:70px;white-space:nowrap} .fgr-receipt-editor-table tbody tr{height:58px}.fgr-receipt-editor-table tbody td{height:58px;box-sizing:border-box;vertical-align:middle!important}.fgr-receipt-editor-table .fgr-editor-color{vertical-align:middle!important;text-align:center!important}.fgr-receipt-editor-table .fgr-editor-color>input{height:34px!important;margin:0!important;text-align:center}.fgr-receipt-editor-table .fgr-editor-size-list{min-height:38px;height:38px;align-items:center!important;vertical-align:middle!important}.fgr-receipt-editor-table .fgr-editor-total{vertical-align:middle!important}.fgr-receipt-editor-table .fgr-editor-total>strong,.fgr-receipt-editor-table .fgr-editor-code-total>strong{display:inline-flex;min-height:34px;align-items:center;justify-content:center}.fgr-receipt-editor-table input:disabled,.fgr-receipt-editor-table select:disabled{opacity:1!important;color:#344054!important;background:#f8fafc!important;-webkit-text-fill-color:#344054!important} #fgrReceiptModal.fgr-view-mode .fgr-receipt-editor-table th:last-child,#fgrReceiptModal.fgr-view-mode .fgr-receipt-editor-table td:last-child{display:none!important}.fgr-readonly-table .fgr-factory-start>td{border-top:0!important}.fgr-readonly-table .fgr-report-actions{white-space:nowrap}.fgr-readonly-table .fgr-report-actions .btn{margin:2px}#fgrSaveState{display:none!important} .fgs-dialog{width:min(1560px,98vw)!important}.fgs-table-wrap{overflow:auto;border:1px solid #d9dde5;border-radius:9px}.fgs-editor-table{width:1450px;min-width:1450px;border-collapse:collapse;table-layout:fixed}.fgs-editor-table th,.fgs-editor-table td{padding:7px;border-right:1px solid #e2e6ec;border-bottom:1px solid #e2e6ec;text-align:center;vertical-align:middle}.fgs-editor-table th{background:#f2f4f7;font-size:11px}.fgs-editor-table select,.fgs-editor-table input{width:100%;height:36px;box-sizing:border-box;border:1px solid #cfd4dc;border-radius:6px;padding:5px 7px}.fgs-size-strip{display:flex;gap:6px;align-items:center;overflow-x:auto;min-height:38px}.fgs-size-box{display:flex;align-items:center;justify-content:center;flex:0 0 82px;height:34px;border:1px solid #d5dbe5;border-radius:6px;background:#f8fafc;font-weight:800}.fgs-number-strip{display:flex;gap:6px;align-items:center;overflow-x:auto}.fgs-number-strip>*{flex:0 0 82px}.fgs-system-value,.fgs-diff-value{display:flex;align-items:center;justify-content:center;height:34px;border-radius:6px;background:#f8fafc;font-weight:800}.fgs-diff-value.positive{color:#087443;background:#eaf7ee}.fgs-diff-value.negative{color:#b42318;background:#fff0f0}.fgs-action-cell{display:flex;gap:6px;justify-content:center}.fgs-view-mode .fgs-edit-action,.fgs-view-mode .fgs-action-cell{display:none!important}.fgs-view-mode input,.fgs-view-mode select{pointer-events:none;background:#f8fafc;color:#344054;opacity:1}.fgs-report-row{cursor:pointer}.fgs-report-row:hover td{background:#f7f8fa} .fgs-editor-table{width:1180px;min-width:1180px}.fgs-size-vertical-table{width:100%;border-collapse:collapse;table-layout:fixed}.fgs-size-vertical-table th,.fgs-size-vertical-table td{height:42px;padding:4px 6px;border:1px solid #d5dbe5;text-align:center;vertical-align:middle}.fgs-size-vertical-table th{background:#f2f4f7;font-size:12px}.fgs-size-vertical-table td:first-child{background:#f8fafc;font-weight:800}.fgs-size-vertical-table input{height:32px;text-align:center} .fgr-table.fgr-grouped-table{min-width:2700px!important}.fgr-grouped-table td[rowspan]{vertical-align:middle!important}.fgr-grouped-table .fgr-merged-product{min-width:190px;text-align:left}.fgr-size-unified{min-width:132px}.fgr-size-unified strong{display:inline-block;min-width:42px}.fgr-size-unified input{display:inline-block!important;width:72px!important;text-align:center}.fgr-grouped-table .fgr-receipt-start>td{border-top-width:3px!important} .fgr-table.fgr-readonly-table{min-width:2450px!important}.fgr-readonly-table td[rowspan]{vertical-align:middle!important}.fgr-view-row{cursor:pointer}.fgr-view-row:hover>td{background:#f0f7ff!important}.fgr-size-horizontal{display:flex;gap:6px;align-items:center;flex-wrap:nowrap}.fgr-size-chip{display:inline-flex;align-items:center;overflow:hidden;border:1px solid #cfd8e6;border-radius:7px;background:#fff;white-space:nowrap}.fgr-size-chip b{padding:5px 7px;background:#eef3f9;color:#344054}.fgr-size-chip em{padding:5px 8px;font-style:normal;font-weight:800;color:#101828}.fgr-row-buttons{display:flex;gap:5px;justify-content:center;margin-top:7px}.fgr-static-status{display:inline-block;padding:5px 8px;border-radius:999px;background:#fff4e5;color:#a15c00;font-size:11px;font-weight:800}.fgr-static-status.done{background:#e8f7ef;color:#087443} /* V3.37.1 hotfix cuối file: modal/header + bảng cây trên mobile */ .mobile-roll-scroll-hint{display:none} .mobile-roll-cards{display:none} .overview-report-sections{display:grid;gap:14px}.overview-report-section{background:#fff;border:1px solid var(--line);border-radius:13px;padding:14px}.overview-report-section-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:11px}.overview-report-section-head h3{margin:0;font-size:16px}.overview-report-section-head .btn{flex:0 0 auto}.overview-report-section>.stats,.overview-report-section>.fgr-summary{margin:0!important}.overview-report-empty{padding:36px;text-align:center;color:var(--muted)} @media(max-width:900px){ body:has(.modal.open) .mobile-app-header{display:none!important} body:not(.logged-out) .modal.open:not(.forced-password-modal):not(.password-recovery-modal){z-index:2147483647!important;inset:0!important;width:100vw!important;height:100dvh!important;padding:0!important;align-items:flex-start!important;overflow:hidden!important} body:not(.logged-out) .modal.open>.dialog{width:100%!important;max-width:100%!important;height:auto!important;max-height:calc(100dvh - max(12px,env(safe-area-inset-top,0px)))!important;margin:0!important;border-radius:10px!important;padding:12px!important;overflow-y:auto!important;overflow-x:hidden!important} body:not(.logged-out) .modal.open>.dialog>.dialog-head{position:sticky!important;top:-12px!important;z-index:2147483600!important;background:#fff!important;margin:-12px -12px 12px!important;padding:12px!important;padding-top:max(12px,env(safe-area-inset-top,0px))!important;border-bottom:1px solid var(--line)!important;align-items:center!important;flex-wrap:nowrap!important} body:not(.logged-out) .modal.open>.dialog>.dialog-head h2{font-size:18px!important;line-height:1.25!important} body:not(.logged-out) .modal.open>.dialog>.dialog-head>.btn{display:inline-flex!important;flex:0 0 auto!important;min-width:60px!important;min-height:40px!important;align-items:center!important;justify-content:center!important;position:relative!important;z-index:2!important} .mobile-roll-scroll-hint{display:block!important;margin:6px 0;padding:7px 10px;border-radius:7px;background:#eff6ff;color:#175cd3;font-size:11px;font-weight:800;text-align:center} #detailModal .order-arrival-block,#issueModal .issue-product-block{display:block!important;width:100%!important;max-width:100%!important;min-width:0!important;overflow:hidden!important} #detailModal .inventory-matrix-wrap,#issueModal .issue-matrix-wrap,#issueDetailModal .inventory-matrix-wrap{display:block!important;width:100%!important;max-width:100%!important;overflow-x:scroll!important;overflow-y:hidden!important;touch-action:pan-x!important;-webkit-overflow-scrolling:touch!important;overscroll-behavior-x:contain!important;padding-bottom:12px!important} #detailModal .order-arrival-table{display:table!important;width:max-content!important;min-width:1120px!important;max-width:none!important;table-layout:auto!important} #detailModal .order-arrival-table th,#detailModal .order-arrival-table td{display:table-cell!important;white-space:nowrap!important;writing-mode:horizontal-tb!important} #detailModal .order-arrival-table .fabric-name{width:180px!important;min-width:180px!important;max-width:180px!important;white-space:normal!important;word-break:normal!important} #detailModal .order-arrival-table .total-col{width:90px!important;min-width:90px!important;max-width:90px!important} #detailModal .order-arrival-table .roll-col{width:82px!important;min-width:82px!important;max-width:82px!important;overflow:visible!important} #issueModal .issue-matrix,#issueDetailModal .unified-roll-table{display:table!important;width:max-content!important;min-width:1120px!important;max-width:none!important;table-layout:auto!important} #issueModal .issue-matrix th,#issueModal .issue-matrix td,#issueDetailModal .unified-roll-table th,#issueDetailModal .unified-roll-table td{display:table-cell!important;white-space:nowrap!important;writing-mode:horizontal-tb!important} #issueModal .issue-matrix .issue-color-name,#issueDetailModal .unified-roll-table .issue-color-name{width:170px!important;min-width:170px!important;max-width:170px!important;white-space:normal!important;word-break:normal!important;overflow:visible!important} #issueModal .issue-matrix .issue-total,#issueDetailModal .unified-roll-table .issue-total{width:88px!important;min-width:88px!important;max-width:88px!important} #issueModal .issue-matrix .issue-roll-cell,#issueDetailModal .unified-roll-table .issue-roll-cell{width:82px!important;min-width:82px!important;max-width:82px!important;overflow:visible!important;opacity:1} #issueModal .issue-roll-cell .roll-num,#issueModal .issue-roll-cell strong{display:block!important;visibility:visible!important;white-space:nowrap!important} #detailModal .desktop-roll-matrix,#issueModal .desktop-roll-matrix,#issueDetailModal .desktop-roll-matrix,.desktop-roll-matrix,.mobile-roll-scroll-hint{display:none!important} .mobile-roll-cards{display:grid!important;gap:10px;width:100%;min-width:0} .mobile-roll-card{border:1px solid #d9e0ea;border-radius:10px;background:#fff;overflow:hidden;min-width:0} .mobile-roll-summary{display:grid;grid-template-columns:minmax(0,1fr) 88px 72px;background:#f4f7fb;border-bottom:1px solid #d9e0ea} .mobile-roll-summary>div{padding:9px 7px;text-align:center;border-right:1px solid #d9e0ea;min-width:0} .mobile-roll-summary>div:last-child{border-right:0}.mobile-roll-summary span{display:block;font-size:9px;color:#667085;font-weight:800;margin-bottom:3px}.mobile-roll-summary strong{display:block;font-size:12px;overflow-wrap:anywhere} .mobile-roll-summary>div:first-child{text-align:left}.mobile-roll-values{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;padding:9px} .mobile-roll-value{display:flex;align-items:center;justify-content:space-between;gap:6px;min-height:46px;padding:7px 9px;border:1px solid #e1e6ed;border-radius:8px;background:#fafbfc;font-size:12px} .mobile-roll-value .roll-num,.mobile-roll-value .roll-ordinal{font-size:10px;color:#667085;font-weight:800}.mobile-roll-value strong{white-space:nowrap} .mobile-roll-value.issue-roll-cell{cursor:pointer}.mobile-roll-value.issue-roll-cell.selected{border-color:#4b83d1;background:#eef5ff}.mobile-roll-value input{display:none!important} #fabricRollOCRModal .fabric-ocr-dialog{height:100dvh!important;max-height:100dvh!important;border-radius:0!important} #fabricOCRCropArea{display:none;min-height:calc(100dvh - 88px)} #fabricOCRCropArea[style*="display: block"]{display:flex!important;flex-direction:column!important} .fabric-ocr-crop-stage{flex:1;min-height:260px!important;max-height:none!important;overflow:hidden!important;padding:4px!important} .fabric-ocr-crop-stage canvas{width:100%!important;height:auto!important;max-height:calc(100dvh - 285px)!important;object-fit:contain!important;touch-action:none!important} .fabric-ocr-crop-head{flex:0 0 auto}.fabric-ocr-crop-actions{flex:0 0 auto;display:grid!important;grid-template-columns:1fr!important}.fabric-ocr-crop-actions>div{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px!important}.fabric-ocr-crop-actions>div:last-child{grid-template-columns:1fr 1.5fr}.fabric-ocr-crop-actions .btn{width:100%!important;white-space:normal!important;padding:8px 5px!important} #orderModal .fabric-order-editor-dialog{height:100dvh!important;max-height:100dvh!important;padding-bottom:76px!important;border-radius:0!important;overscroll-behavior:contain!important} #orderModal .fabric-order-summary-cards{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:6px!important;margin:7px 8px!important} #orderModal .fabric-order-summary-cards .card{min-height:56px!important;padding:8px 9px!important} #orderModal .fabric-order-summary-cards .value{font-size:14px!important;margin-top:3px!important} #orderModal .fabric-order-editor-footer{position:fixed!important;left:0!important;right:0!important;bottom:0!important;width:100vw!important;min-height:68px!important;height:auto!important;margin:0!important;padding:8px 10px max(8px,env(safe-area-inset-bottom,0px))!important;z-index:2147483647!important;display:grid!important;grid-template-columns:minmax(0,1fr) minmax(190px,1.35fr)!important;align-items:center!important;gap:8px!important;background:#fff!important} #orderModal .fabric-order-footer-summary{font-size:10px!important;line-height:1.25!important;min-width:0!important;overflow-wrap:anywhere} #orderModal .fabric-order-footer-actions{display:grid!important;grid-template-columns:minmax(70px,.75fr) minmax(112px,1.25fr)!important;width:100%!important;gap:7px!important;min-width:0!important} #orderModal .fabric-order-footer-actions .btn,#orderModal .fabric-order-save-btn{display:flex!important;width:100%!important;min-width:0!important;height:42px!important;padding:7px 6px!important;align-items:center!important;justify-content:center!important;white-space:nowrap!important;overflow:visible!important;font-size:12px!important;line-height:1!important} } @media(max-width:370px){#orderModal .fabric-order-editor-footer{grid-template-columns:1fr!important}.fabric-order-footer-summary{display:none!important}#orderModal .fabric-order-editor-dialog{padding-bottom:70px!important}} /* V3.37.2 - một biểu tượng lịch duy nhất trên mọi Filter Bar */ .roway-date-filter{position:relative!important;display:inline-flex!important;flex:0 0 auto!important;margin:0!important;padding:0!important;background:transparent!important;border:0!important;box-shadow:none!important}.roway-date-filter-toggle{width:38px!important;height:36px!important;min-width:38px!important;padding:0!important;border:1px solid #d0d5dd!important;border-radius:8px!important;background:#fff!important;color:#344054!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;cursor:pointer!important}.roway-date-filter-toggle:hover,.roway-date-filter-toggle.is-active{border-color:#1677ff!important;background:#eff6ff!important;color:#0958d9!important}.roway-date-filter-toggle-icon{display:flex!important;align-items:center!important;justify-content:center!important;font-size:0!important}.roway-date-filter-toggle-icon svg{width:19px;height:19px;display:block}.roway-date-filter-toggle-text,.roway-date-filter-current,.roway-date-filter-body{display:none!important}.roway-replaced-date-input{display:none!important}#ordersDateFilterPortal{display:none!important} .roway-calendar-portal{display:none;position:fixed;inset:0;z-index:2147483647}.roway-calendar-portal.open{display:block}.roway-calendar-backdrop{position:absolute;inset:0;background:rgba(15,23,42,.28)}.roway-calendar-dialog{position:absolute;width:min(760px,calc(100vw - 24px));max-height:calc(100dvh - 24px);overflow:auto;background:#fff;border:1px solid #d0d5dd;border-radius:10px;box-shadow:0 16px 45px rgba(16,24,40,.22);display:grid;grid-template-columns:155px minmax(0,1fr)}.roway-calendar-presets{grid-row:1 / span 2;border-right:1px solid #e4e7ec;padding:8px 0;display:flex;flex-direction:column}.roway-calendar-preset{border:0;background:transparent;text-align:left;padding:10px 17px;font:inherit;color:#344054;cursor:pointer}.roway-calendar-preset:hover,.roway-calendar-preset.selected{background:#eff6ff;color:#0958d9;font-weight:700}.roway-calendar-main{min-width:0}.roway-calendar-range{height:45px;border-bottom:1px solid #d0d5dd;display:grid;grid-template-columns:1fr 26px 1fr;align-items:center;padding:0 12px;gap:5px}.roway-calendar-range input{width:100%;height:38px;border:0!important;border-bottom:2px solid transparent!important;border-radius:0!important;padding:5px 2px!important;outline:0;background:#fff;font-size:14px}.roway-calendar-range input:focus{border-bottom-color:#1677ff!important}.roway-calendar-arrow{text-align:center;color:#98a2b3}.roway-calendar-months{display:grid;grid-template-columns:1fr 1fr;gap:14px;padding:12px}.roway-calendar-month{min-width:0}.roway-calendar-month-head{height:30px;display:grid;grid-template-columns:32px 1fr 32px;align-items:center;text-align:center;font-weight:800}.roway-calendar-nav{border:0;background:transparent;font-size:21px;color:#667085;cursor:pointer;padding:2px}.roway-calendar-week,.roway-calendar-days{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));text-align:center}.roway-calendar-week span{font-size:12px;font-weight:700;padding:8px 0;color:#475467}.roway-calendar-day{height:34px;border:0;background:transparent;border-radius:6px;color:#344054;cursor:pointer;font:inherit}.roway-calendar-day:hover{background:#eff6ff}.roway-calendar-day.outside{color:#c5cad3}.roway-calendar-day.in-range{background:#eaf3ff;border-radius:0}.roway-calendar-day.range-start,.roway-calendar-day.range-end{background:#1677ff;color:#fff!important;border-radius:6px}.roway-calendar-day.today{outline:1px solid #1677ff}.roway-calendar-footer{grid-column:1 / -1;border-top:1px solid #e4e7ec;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 13px}.roway-calendar-summary{font-size:12px;color:#667085}.roway-calendar-actions{display:flex;gap:7px}.roway-calendar-actions .btn{min-width:72px} @media(max-width:700px){.roway-calendar-dialog{left:0!important;right:0!important;bottom:0!important;top:auto!important;width:100%!important;max-height:calc(100dvh - 56px);border-radius:14px 14px 0 0;grid-template-columns:1fr}.roway-calendar-presets{grid-row:auto;border-right:0;border-bottom:1px solid #e4e7ec;display:grid;grid-template-columns:repeat(4,1fr);padding:7px;gap:5px}.roway-calendar-preset{padding:8px 3px;text-align:center;font-size:11px;border:1px solid #e4e7ec;border-radius:7px}.roway-calendar-main{grid-row:2}.roway-calendar-months{grid-template-columns:1fr;padding:8px 12px}.roway-calendar-month:nth-child(2){display:none}.roway-calendar-footer{grid-column:1;padding-bottom:max(9px,env(safe-area-inset-bottom,0px))}.roway-calendar-summary{display:none}} /* V3.37.4 - Filter Bar nhiều lựa chọn, thu gọn trên mobile và bỏ mô tả phụ */ .panel>.top>div:first-child>h1~.small{display:none!important}.panel>.top{margin-bottom:10px!important}.panel>.top>div:first-child>h1{margin-bottom:0!important} .roway-multiselect{position:relative;display:inline-flex;min-width:140px;max-width:240px}.roway-multiselect-source{position:absolute!important;width:1px!important;height:1px!important;opacity:0!important;pointer-events:none!important}.roway-multiselect-toggle{width:100%;height:36px;padding:6px 28px 6px 10px;border:1px solid #cfd4dc;border-radius:7px;background:#fff;color:#344054;text-align:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;cursor:pointer;position:relative}.roway-multiselect-toggle:after{content:'⌄';position:absolute;right:9px;top:7px;color:#667085}.roway-multiselect.has-value .roway-multiselect-toggle{border-color:#1677ff;background:#eff6ff;color:#0958d9;font-weight:700}.roway-multiselect-menu{display:none;position:absolute;left:0;top:calc(100% + 4px);z-index:1000;width:max-content;min-width:100%;max-width:min(320px,calc(100vw - 24px));max-height:280px;overflow:auto;padding:6px;background:#fff;border:1px solid #d0d5dd;border-radius:8px;box-shadow:0 12px 30px rgba(16,24,40,.18)}.roway-multiselect.open .roway-multiselect-menu{display:block}.roway-multiselect-option{display:flex;align-items:center;gap:8px;min-height:34px;padding:5px 7px;border-radius:6px;cursor:pointer;white-space:nowrap}.roway-multiselect-option:hover{background:#f2f4f7}.roway-multiselect-option input{width:16px!important;height:16px!important;min-width:16px!important;margin:0!important}.roway-mobile-filter-toggle{display:none;align-items:center;justify-content:center;gap:6px;height:36px;padding:6px 10px}.roway-mobile-filter-toggle svg{width:18px;height:18px} @media(max-width:700px){.roway-mobile-filter-toggle{display:inline-flex!important}.roway-filter-bar{display:none!important;width:100%!important}.roway-filter-bar.roway-filter-bar-open{display:flex!important;flex-wrap:wrap!important;align-items:center!important;gap:7px!important;margin-top:8px!important}.roway-filter-bar.roway-filter-bar-open>*{min-width:calc(50% - 4px)!important;max-width:none!important;flex:1 1 calc(50% - 4px)!important}.roway-filter-bar.roway-filter-bar-open input[type="search"],.roway-filter-bar.roway-filter-bar-open input:not([type]),.roway-filter-bar.roway-filter-bar-open #fgrSearch{min-width:100%!important;flex-basis:100%!important}.roway-filter-bar .roway-date-filter{min-width:38px!important;flex:0 0 38px!important}.roway-multiselect-menu{position:fixed;left:12px!important;right:12px!important;top:auto!important;bottom:12px;width:auto!important;max-width:none!important;max-height:55dvh;z-index:2147483646}.panel>.top{margin-bottom:7px!important}} /* V3.37.5 - Bulk Selection & Bulk Actions */ .roway-bulk-select-col{width:42px!important;min-width:42px!important;max-width:42px!important;text-align:center!important;padding:5px!important}.roway-bulk-checkbox{width:17px!important;height:17px!important;min-width:17px!important;margin:0!important;accent-color:#1677ff;cursor:pointer}.roway-bulk-selected>td{box-shadow:inset 0 0 0 9999px rgba(22,119,255,.055)}.roway-bulk-bar{display:none;position:relative;align-items:center;justify-content:space-between;gap:10px;margin:8px 0;padding:9px 11px;border:1px solid #b2ddff;border-radius:9px;background:#eff8ff;color:#175cd3}.roway-bulk-bar.active{display:flex}.roway-bulk-info{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:800}.roway-bulk-count{display:inline-flex;align-items:center;justify-content:center;min-width:25px;height:25px;padding:0 7px;border-radius:99px;background:#1677ff;color:#fff}.roway-bulk-actions{position:relative}.roway-bulk-menu{display:none;position:absolute;right:0;top:calc(100% + 6px);z-index:1500;width:min(410px,calc(100vw - 28px));padding:12px;border:1px solid #d0d5dd;border-radius:10px;background:#fff;box-shadow:0 14px 35px rgba(16,24,40,.2);color:#344054}.roway-bulk-menu.open{display:block}.roway-bulk-menu-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.roway-bulk-menu label{display:block;font-size:11px;font-weight:800;color:#667085}.roway-bulk-menu select,.roway-bulk-menu input{display:block;width:100%;height:38px;margin-top:4px;padding:7px 9px;border:1px solid #d0d5dd;border-radius:7px;background:#fff}.roway-bulk-menu-footer{display:flex;justify-content:flex-end;gap:7px;margin-top:10px}.roway-bulk-empty{padding:8px 2px;font-size:12px;color:#b54708}.roway-bulk-toast{position:fixed;right:18px;bottom:18px;z-index:2147483647;padding:10px 14px;border-radius:8px;background:#067647;color:#fff;font-weight:800;box-shadow:0 10px 30px rgba(16,24,40,.22)} @media(max-width:700px){.roway-bulk-bar{position:sticky;top:58px;z-index:35;margin:7px 0;padding:8px}.roway-bulk-info{font-size:12px}.roway-bulk-menu{position:fixed;left:12px;right:12px;top:auto;bottom:max(12px,env(safe-area-inset-bottom,0px));width:auto}.roway-bulk-menu-grid{grid-template-columns:1fr}.roway-bulk-select-col{width:38px!important;min-width:38px!important}} .fg-sale-size-grid{display:flex;flex-wrap:wrap;gap:6px;min-width:260px}.fg-sale-size-grid label{display:grid;grid-template-columns:34px 62px;align-items:center;gap:3px;padding:5px;border:1px solid #e1e6ed;border-radius:7px;background:#fafbfc}.fg-sale-size-grid input{width:62px!important;height:30px!important;text-align:center}.fg-sale-size-grid small{grid-column:1/-1;color:#667085;text-align:center}.fg-sale-size-grid b{text-align:center}.fgr-readonly-table th,.fgr-readonly-table td{white-space:normal}.fg-sale-size-grid+span{font-size:11px} @media(max-width:700px){#fgSaleModal .dialog{width:100%!important;height:100dvh!important;max-height:100dvh!important;border-radius:0!important}.fg-sale-size-grid{min-width:220px}.fg-sale-size-grid label{grid-template-columns:30px 54px}.fg-sale-size-grid input{width:54px!important}} /* V3.37.11 - Phiếu bán thành phẩm đồng bộ cấu trúc phiếu nhập kho */ #fgSaleModal .dialog{width:min(1500px,98vw)!important;max-width:1500px!important;padding:0!important;overflow:hidden!important} #fgSaleModal .dialog-head{padding:18px 20px;border-bottom:1px solid #d9dde5;background:#fff} #fgSaleModal .form-grid{margin:16px 20px 14px;padding:14px;background:#fff;border:1px solid #d9dde5;border-radius:10px} #fgSaleModal .section-title{margin:0 20px;padding:12px 14px;background:#fff;border:1px solid #d9dde5;border-bottom:0;border-radius:10px 10px 0 0} #fgSaleRows{margin:0 20px;max-height:48vh;overflow:auto;border:1px solid #d9dde5;background:#fff} #fgSaleRows .fg-sale-receipt-table{border-collapse:collapse;table-layout:fixed;min-width:1180px} #fgSaleRows .fg-sale-receipt-table th{height:42px;padding:6px;background:#f2f4f7;text-align:center!important;vertical-align:middle;font-size:11px} #fgSaleRows .fg-sale-receipt-table td{padding:8px 6px;border-bottom:1px solid #e8ebef;text-align:center;vertical-align:middle} #fgSaleRows select,#fgSaleRows input{width:100%;height:38px;box-sizing:border-box} #fgSaleRows .fg-sale-product{text-align:left;min-width:220px} #fgSaleRows .fg-sale-color{min-width:135px} #fgSaleRows .fg-sale-size-list{display:grid;grid-template-columns:repeat(3,minmax(90px,1fr));gap:6px;min-width:300px} #fgSaleRows .fg-sale-size-item{display:grid;grid-template-columns:32px 1fr;gap:4px;align-items:center} #fgSaleRows .fg-sale-size-item b{font-size:11px;color:#475467} #fgSaleRows .fg-sale-size-item input{text-align:center;height:34px} #fgSaleRows .fg-sale-size-item small{grid-column:1/-1;color:#667085;white-space:nowrap} #fgSaleRows .fg-sale-actions{white-space:nowrap;min-width:145px} #fgSaleRows .fg-sale-actions .btn{margin:2px} #fgSaleModal #fgSaleSummary{margin:14px 20px} #fgSaleModal>.dialog>.actions{padding:12px 20px;border-top:1px solid #d9dde5;background:#fff} /* V3.37.13 - Size phiếu bán hiển thị một hàng và căn chỉnh viền */ #fgSaleRows .fg-sale-receipt-table{table-layout:auto!important;min-width:1500px!important} #fgSaleRows .fg-sale-receipt-table th,#fgSaleRows .fg-sale-receipt-table td{border:1px solid rgba(0,0,0,.28)!important;box-sizing:border-box} #fgSaleRows .fg-sale-receipt-table th{height:44px!important;white-space:nowrap} #fgSaleRows .fg-sale-receipt-table td{height:56px!important} #fgSaleRows .fg-sale-receipt-table select,#fgSaleRows .fg-sale-receipt-table input{height:38px!important;border:1px solid rgba(0,0,0,.28)!important;border-radius:6px!important;margin:0!important} #fgSaleRows .fg-sale-size-list{display:flex!important;align-items:center!important;gap:8px!important;min-width:max-content!important;white-space:nowrap!important} #fgSaleRows .fg-sale-receipt-table th:nth-child(4),#fgSaleRows .fg-sale-receipt-table td:has(.fg-sale-size-list){min-width:620px!important} #fgSaleRows .fg-sale-size-item{display:flex!important;align-items:center!important;gap:5px!important;min-width:max-content!important;height:38px!important;padding:0 6px!important;border:1px solid rgba(0,0,0,.22)!important;border-radius:6px!important;background:#fff!important} #fgSaleRows .fg-sale-size-item b{display:inline-block!important;min-width:24px!important;text-align:center!important} #fgSaleRows .fg-sale-size-item input{width:58px!important;min-width:58px!important;height:30px!important;padding:4px!important;text-align:center!important} #fgSaleRows .fg-sale-size-item small{display:inline-block!important;grid-column:auto!important;white-space:nowrap!important;margin:0!important;color:#667085!important} #fgSaleRows .fg-sale-actions{display:table-cell!important;vertical-align:middle!important} /* Charcoal sidebar visual hierarchy — CSS only */ .sidebar{ background:#111111!important; } .sidebar .brand{color:#fff!important} .sidebar .brand-sub, .sidebar .sidebar-bottom{color:#A8A8A8!important} /* Dewego brand mark — login and sidebar */ .dewego-brand-logo{display:block;object-fit:contain} .login-brand-logo{width:min(270px,78vw);height:auto;margin:0 auto 18px} .sidebar-brand-logo-wrap{display:flex;align-items:center;width:100%;min-height:54px;padding:8px 10px;margin:0 0 12px;border-radius:10px;background:#fff} .sidebar-brand-logo{display:block;width:100%;height:auto;max-height:38px;object-fit:contain} .mobile-header-brand .dewego-brand-logo{width:128px;max-height:30px;margin:auto} @media(max-width:760px){ .sidebar-brand-logo-wrap{width:calc(100% - 48px);margin:0} .login-brand-logo{width:min(245px,72vw);margin-bottom:16px} } .sidebar .nav-parent.roway-accordion-parent{ background:#1B1B1B!important; border:1px solid #414141!important; border-radius:8px!important; color:#fff!important; font-weight:800!important; text-transform:uppercase; transition:background-color 150ms ease,border-color 150ms ease,color 150ms ease!important; } .sidebar .nav-parent.roway-accordion-parent:hover, .sidebar .nav-parent.roway-accordion-parent:focus-visible, .sidebar .nav-parent.roway-accordion-parent.is-open, .sidebar .nav-parent.roway-accordion-parent.has-active-child{ background:#202020!important; border-color:#464646!important; color:#fff!important; } .sidebar .roway-accordion-arrow{ color:#E1E1E1!important; } .sidebar .nav-parent.roway-accordion-parent.is-open .roway-accordion-arrow{ color:#FFFFFF!important; } .sidebar .nav-children{ padding-left:14px!important; } .sidebar .nav-children button{ background:transparent!important; border:0!important; border-radius:8px!important; box-shadow:none!important; color:#DEDEDE!important; margin:3px 0!important; padding:10px 10px 10px 24px!important; transition:background-color 150ms ease,color 150ms ease!important; } .sidebar .nav-children button:before{ color:#8E8E8E!important; left:9px!important; } .sidebar .nav-children button:hover{ background:#292929!important; color:#fff!important; } .sidebar .nav-children button:hover:before{ color:#fff!important; } .sidebar .nav-children button.active{ background:#4A4A4A!important; border-left:none!important; box-shadow:none!important; color:#FFFFFF!important; font-weight:700!important; } .sidebar .nav-children button.active:before{ color:#FFFFFF!important; } @media(max-width:900px){ .sidebar{background:#111111!important} /* Chuẩn hóa toàn bộ ô menu mobile về cùng lề, chiều rộng và chiều cao. */ .sidebar .nav{ padding-left:4px!important; padding-right:4px!important; } .sidebar .nav>.dashboard-menu-button, .sidebar .nav-parent.roway-accordion-parent, .sidebar .nav-children button{ width:100%!important; min-height:44px!important; margin-left:0!important; margin-right:0!important; border-radius:8px!important; box-sizing:border-box!important; } .sidebar .nav>.dashboard-menu-button, .sidebar .nav-children button{ display:flex!important; align-items:center!important; padding:10px 12px!important; line-height:1.25!important; } .sidebar .nav-parent.roway-accordion-parent{ display:flex!important; align-items:center!important; cursor:pointer!important; margin-top:10px!important; margin-bottom:4px!important; padding:10px 12px!important; } .sidebar .nav-children{ width:100%!important; padding-left:0!important; padding-right:0!important; display:block!important; max-height:0!important; opacity:0!important; overflow:hidden!important; pointer-events:none!important; transform:translateY(-4px)!important; } .sidebar .nav-parent.roway-accordion-parent.is-open+.nav-children{ max-height:1400px!important; opacity:1!important; pointer-events:auto!important; transform:translateY(0)!important; } .sidebar .roway-accordion-arrow{display:inline-flex!important} .sidebar .nav-children button{ margin-top:3px!important; margin-bottom:3px!important; } .sidebar .sidebar-mobile-close{ background:#1B1B1B!important; border-color:#414141!important; color:#fff!important; } } .saas-shell-card{margin-top:14px} [data-saas-section]{scroll-margin-top:24px} /* Cho phép cuộn sidebar nhưng không hiển thị thanh cuộn. */ .sidebar{ overflow-y:auto!important; overflow-x:hidden!important; overscroll-behavior:contain; -webkit-overflow-scrolling:touch; scrollbar-width:none!important; -ms-overflow-style:none!important; } .sidebar::-webkit-scrollbar, .sidebar .nav::-webkit-scrollbar{ display:none!important; width:0!important; height:0!important; background:transparent!important; } .sidebar .nav{ scrollbar-width:none!important; -ms-overflow-style:none!important; } /* V3.37.64 - vùng cuộn dọc thống nhất để sticky header hoạt động trên PC/laptop/mobile. */ .data-table-scroll, .table-scroll, .inventory-matrix-wrap, .issue-matrix-wrap, .product-cost-table-wrap, .factory-accessory-detail-table-wrap, .accessory-order-list-wrap, .accessory-issue-list-wrap, .fgs-table-wrap, .fgr-receipt-lines-wrap{ position:relative!important; display:block!important; width:100%!important; max-width:100%!important; max-height:calc(100dvh - 240px); overflow:auto!important; overscroll-behavior:contain; -webkit-overflow-scrolling:touch; scrollbar-gutter:stable; } /* V3.37.66 - popup có bảng tự dùng tối đa chiều rộng màn hình còn trống. */ @media(min-width:901px){ body:not(.logged-out) .modal.open>.dialog:has(table){ width:min(1840px,calc(100vw - 32px))!important; max-width:calc(100vw - 32px)!important; margin-left:auto!important; margin-right:auto!important; } body:not(.logged-out) .modal.open>.dialog:has(table) .data-table-scroll, body:not(.logged-out) .modal.open>.dialog:has(table) [class*="table-wrap"], body:not(.logged-out) .modal.open>.dialog:has(table) [class*="table-scroll"]{ width:100%!important; max-width:100%!important; } } @media(min-width:901px) and (max-width:1400px){ body:not(.logged-out) .modal.open>.dialog:has(table){ padding-left:14px!important; padding-right:14px!important; } body:not(.logged-out) .modal.open>.dialog:has(table) table:not(.fgr-table) th, body:not(.logged-out) .modal.open>.dialog:has(table) table:not(.fgr-table) td{ padding-left:7px!important; padding-right:7px!important; font-size:12px; } } /* Cố định mọi ô của hàng tiêu đề, không chỉ phần tử thead. */ .panel table:not(.fgr-table)>thead>tr:first-child>th, .modal .dialog table:not(.fgr-table)>thead>tr:first-child>th{ position:sticky!important; top:0!important; z-index:30!important; background:#FAFAFA!important; box-shadow:0 1px 0 #C9CDD3,0 2px 5px rgba(16,24,40,.06)!important; background-clip:padding-box!important; } /* Tiêu đề bảng trong popup chỉ sticky bên trong vùng cuộn của chính bảng. Không cho tiêu đề bám vào vùng cuộn của dialog và đè lên đầu popup. */ .modal .dialog table:not(.fgr-table)>thead>tr:first-child>th{ position:static!important; box-shadow:0 1px 0 #C9CDD3!important; } .modal .dialog .data-table-scroll table:not(.fgr-table)>thead>tr:first-child>th, .modal .dialog .table-scroll table:not(.fgr-table)>thead>tr:first-child>th, .modal .dialog .inventory-matrix-wrap table:not(.fgr-table)>thead>tr:first-child>th, .modal .dialog .issue-matrix-wrap table:not(.fgr-table)>thead>tr:first-child>th, .modal .dialog .product-cost-table-wrap table:not(.fgr-table)>thead>tr:first-child>th, .modal .dialog .factory-accessory-detail-table-wrap table:not(.fgr-table)>thead>tr:first-child>th, .modal .dialog .accessory-order-list-wrap table:not(.fgr-table)>thead>tr:first-child>th, .modal .dialog .accessory-issue-list-wrap table:not(.fgr-table)>thead>tr:first-child>th, .modal .dialog .fgs-table-wrap table:not(.fgr-table)>thead>tr:first-child>th, .modal .dialog .fgr-receipt-lines-wrap table:not(.fgr-table)>thead>tr:first-child>th{ position:sticky!important; top:0!important; z-index:30!important; background:#FAFAFA!important; box-shadow:0 1px 0 #C9CDD3,0 2px 5px rgba(16,24,40,.06)!important; } /* Khi popup mở, sticky header của bảng phía sau phải nằm dưới backdrop. Nếu không, z-index của th (30) sẽ xuyên qua modal mặc định (20). */ body:has(.modal.open) .panel table>thead>tr>th, body:has(.modal.open) .panel .data-table-scroll table>thead>tr>th, body:has(.modal.open) .panel .table-scroll table>thead>tr>th{ z-index:1!important; } body:not(.logged-out) .modal.open{ isolation:isolate; } /* Các bảng được tạo trong vùng ngoài panel/modal (quản trị SaaS, tài khoản...). */ .data-table-scroll>table:not(.fgr-table)>thead>tr:first-child>th, .inventory-matrix-wrap>table:not(.fgr-table)>thead>tr:first-child>th, .issue-matrix-wrap>table:not(.fgr-table)>thead>tr:first-child>th, .fgs-table-wrap>table:not(.fgr-table)>thead>tr:first-child>th{ position:sticky!important; top:0!important; z-index:30!important; background:#FAFAFA!important; box-shadow:0 1px 0 #C9CDD3,0 2px 5px rgba(16,24,40,.06)!important; } /* Giữ độ tương phản cho tiêu đề bảng chọn cây vải trong popup. */ .inventory-matrix-wrap table.inventory-matrix>thead>tr:first-child>th, .inventory-matrix-wrap table.unified-roll-table>thead>tr:first-child>th, .issue-matrix-wrap table.issue-matrix>thead>tr:first-child>th, .issue-matrix-wrap table.unified-roll-table>thead>tr:first-child>th, .desktop-roll-matrix table>thead>tr:first-child>th{ background:#111827!important; color:#FFFFFF!important; border-color:#374151!important; box-shadow:0 1px 0 #374151,0 2px 5px rgba(16,24,40,.16)!important; } .inventory-matrix-wrap table.inventory-matrix>tbody>tr>td, .inventory-matrix-wrap table.unified-roll-table>tbody>tr>td, .issue-matrix-wrap table.issue-matrix>tbody>tr>td, .issue-matrix-wrap table.unified-roll-table>tbody>tr>td, .desktop-roll-matrix table>tbody>tr>td{ color:#111827!important; } .inventory-matrix-wrap .roll-ordinal, .issue-matrix-wrap .roll-ordinal, .desktop-roll-matrix .roll-ordinal{ color:#667085!important; } .mobile-roll-card, .mobile-roll-card .mobile-roll-summary, .mobile-roll-card .mobile-roll-values, .mobile-roll-card .mobile-roll-value, .mobile-roll-card strong{ color:#111827!important; } /* V3.38.22 - Khóa tương phản tại chính phần tử hiển thị cây vải. Không dựa vào màu kế thừa từ modal/theme vì popup được tạo động có thể ghi đè màu của td. */ .inventory-matrix tbody td.roll-col, .inventory-matrix tbody td.roll-meter, .inventory-matrix tbody td.order-arrival-roll, .inventory-matrix tbody td.incoming-roll-cell, .issue-matrix tbody td.issue-roll-cell, .unified-roll-table tbody td.roll-col, .unified-roll-table tbody td.issue-roll-cell{ background-color:#FFFFFF!important; color:#111827!important; -webkit-text-fill-color:#111827!important; } .inventory-matrix tbody td.roll-empty, .unified-roll-table tbody td.roll-empty, .issue-matrix tbody td.disabled-cell{ background-color:#FAFAFA!important; color:#98A2B3!important; -webkit-text-fill-color:#98A2B3!important; } .inventory-matrix tbody .roll-ordinal, .inventory-matrix tbody .roll-num, .issue-matrix tbody .roll-ordinal, .issue-matrix tbody .roll-num, .unified-roll-table tbody .roll-ordinal, .unified-roll-table tbody .roll-num, .mobile-roll-card .roll-ordinal, .mobile-roll-card .roll-num{ color:#667085!important; -webkit-text-fill-color:#667085!important; } .inventory-matrix tbody td.roll-col strong, .inventory-matrix tbody td.roll-meter strong, .issue-matrix tbody td.issue-roll-cell strong, .unified-roll-table tbody td strong, .mobile-roll-card .mobile-roll-summary strong, .mobile-roll-card .mobile-roll-value strong{ color:#111827!important; -webkit-text-fill-color:#111827!important; } .mobile-roll-card, .mobile-roll-card .mobile-roll-values{ background:#FFFFFF!important; } .mobile-roll-card .mobile-roll-summary{ background:#F4F7FB!important; } .mobile-roll-card .mobile-roll-value{ background:#FAFBFC!important; color:#111827!important; -webkit-text-fill-color:#111827!important; } .issue-matrix tbody td.issue-roll-cell.selected, .mobile-roll-card .mobile-roll-value.issue-roll-cell.selected{ background:#EEF5FF!important; color:#111827!important; -webkit-text-fill-color:#111827!important; } @media(max-width:900px){ .data-table-scroll, .table-scroll, .inventory-matrix-wrap, .issue-matrix-wrap, .product-cost-table-wrap, .factory-accessory-detail-table-wrap, .accessory-order-list-wrap, .accessory-issue-list-wrap, .fgs-table-wrap, .fgr-receipt-lines-wrap{ max-height:calc(100dvh - 180px); touch-action:pan-x pan-y; } } @media print{ .data-table-scroll, .table-scroll, .inventory-matrix-wrap, .issue-matrix-wrap, .product-cost-table-wrap, .factory-accessory-detail-table-wrap, .accessory-order-list-wrap, .accessory-issue-list-wrap, .fgs-table-wrap, .fgr-receipt-lines-wrap{ max-height:none!important; overflow:visible!important; } .panel table>thead>tr>th, .modal .dialog table>thead>tr>th{ position:static!important; box-shadow:none!important; } } .saas-subview-host{display:block;min-width:0;width:100%}.saas-subview-host>[data-saas-section]{max-width:100%}@media(max-width:900px){.saas-subview-host{overflow-x:clip}.saas-subview-host .card,.saas-subview-host section{min-width:0}.saas-subview-host .s8-detail,.saas-subview-host .tenant360-detail{grid-template-columns:1fr!important}} .classification-tag-source{display:none!important} .classification-tag-editor{display:flex;align-items:center;flex-wrap:wrap;gap:7px;min-height:44px;width:100%;padding:6px 9px;border:1px solid var(--line,#d8d8d8);border-radius:8px;background:var(--card,#fff);cursor:text} .classification-tag-editor:focus-within{border-color:var(--primary,#222);box-shadow:0 0 0 2px rgba(30,90,60,.12)} .classification-tag-chip{display:inline-flex;align-items:center;gap:5px;max-width:100%;padding:5px 8px;border-radius:999px;background:var(--soft,#f1f4f2);color:var(--text,#171717);font-size:13px;font-weight:650} .classification-tag-chip span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .classification-tag-chip button{border:0;background:transparent;color:inherit;padding:0;line-height:1;cursor:pointer;font-size:16px} .classification-tag-input{flex:1 1 130px!important;min-width:120px!important;width:auto!important;border:0!important;outline:0!important;box-shadow:none!important;padding:5px 2px!important;background:transparent!important;color:var(--text,#171717)!important} .classification-quick-entry{margin:0 0 10px}.classification-quick-entry input{width:100%}.classification-quick-entry .small{margin-top:5px} @media(max-width:700px){.classification-tag-editor{min-height:48px}.classification-tag-chip{font-size:14px}.classification-tag-input{min-height:32px}} /* Xuất vải SX: dựng một lần theo quyền và giữ cột thao tác ổn định. */ #issuesTable .fabric-issue-action-cell{vertical-align:middle} #issuesTable .fabric-issue-row-actions{display:inline-flex;align-items:center;gap:4px;white-space:nowrap;min-height:32px} #issuesTable .fabric-issue-row-actions>.btn{flex:0 0 auto;margin:0} html body table.inventory-matrix thead tr th, html body table.issue-matrix thead tr th, html body table.unified-roll-table thead tr th, html body table.order-arrival-table thead tr th, html body table.incoming-inventory-matrix thead tr th{ background:#111827!important; background-color:#111827!important; color:#FFFFFF!important; -webkit-text-fill-color:#FFFFFF!important; border-color:#374151!important; } html body table.inventory-matrix tbody tr td, html body table.issue-matrix tbody tr td, html body table.unified-roll-table tbody tr td, html body table.order-arrival-table tbody tr td, html body table.incoming-inventory-matrix tbody tr td{ background:#FFFFFF!important; background-color:#FFFFFF!important; color:#111827!important; -webkit-text-fill-color:#111827!important; } html body table.inventory-matrix tbody tr td *, html body table.issue-matrix tbody tr td *, html body table.unified-roll-table tbody tr td *, html body table.order-arrival-table tbody tr td *, html body table.incoming-inventory-matrix tbody tr td *{ color:#111827!important; -webkit-text-fill-color:#111827!important; } html body table.inventory-matrix tbody .roll-ordinal, html body table.issue-matrix tbody .roll-num, html body table.unified-roll-table tbody .roll-ordinal, html body table.order-arrival-table tbody .roll-ordinal, html body table.incoming-inventory-matrix tbody .roll-ordinal, html body .mobile-roll-card .roll-num, html body .mobile-roll-card .roll-ordinal{ color:#667085!important; -webkit-text-fill-color:#667085!important; } html body .mobile-roll-card, html body .mobile-roll-card .mobile-roll-values{ background:#FFFFFF!important; color:#111827!important; -webkit-text-fill-color:#111827!important; } html body .mobile-roll-card .mobile-roll-summary{ background:#F4F7FB!important; color:#111827!important; -webkit-text-fill-color:#111827!important; } html body .mobile-roll-card .mobile-roll-value{ background:#FAFBFC!important; color:#111827!important; -webkit-text-fill-color:#111827!important; } html body .mobile-roll-card .mobile-roll-summary strong, html body .mobile-roll-card .mobile-roll-value strong{ color:#111827!important; -webkit-text-fill-color:#111827!important; } html body table.issue-matrix tbody td.issue-roll-cell.selected, html body .mobile-roll-card .mobile-roll-value.issue-roll-cell.selected{ background:#EEF5FF!important; background-color:#EEF5FF!important; color:#111827!important; -webkit-text-fill-color:#111827!important; } /* V3.38.25 - Ba popup thực tế có selector sticky độ ưu tiên cao hơn CSS chung. Bám trực tiếp ID popup để tiêu đề không còn bị ép nền trắng. */ html body #detailModal.modal.open .dialog .inventory-matrix-wrap table.inventory-matrix:not(.fgr-table)>thead>tr:first-child>th, html body #detailModal.modal.open .dialog .inventory-matrix-wrap table.order-arrival-table:not(.fgr-table)>thead>tr:first-child>th, html body #inventoryDetailModal.modal.open .dialog .inventory-matrix-wrap table.inventory-matrix:not(.fgr-table)>thead>tr:first-child>th, html body #inventoryDetailModal.modal.open .dialog .inventory-matrix-wrap table.unified-roll-table:not(.fgr-table)>thead>tr:first-child>th, html body #issueDetailModal.modal.open .dialog .inventory-matrix-wrap table.inventory-matrix:not(.fgr-table)>thead>tr:first-child>th, html body #issueDetailModal.modal.open .dialog .inventory-matrix-wrap table.unified-roll-table:not(.fgr-table)>thead>tr:first-child>th{ background:#111827!important; background-color:#111827!important; color:#FFFFFF!important; -webkit-text-fill-color:#FFFFFF!important; border-color:#374151!important; box-shadow:0 1px 0 #374151,0 2px 5px rgba(16,24,40,.16)!important; background-clip:padding-box!important; } html body #detailModal .roll-quantity-group-head, html body #inventoryDetailModal .roll-quantity-group-head, html body #issueDetailModal .roll-quantity-group-head{ text-align:center!important; letter-spacing:.01em; } html body table .roway-document-value, html body table .roway-document-value *, html body table .roway-document-value input, html body table .roway-document-value select, html body table .roway-document-value button{ font-weight:800!important; } .report-foundation-panel{--report-navy:#00437c;max-width:1600px;margin:0 auto} .report-shell-head{align-items:flex-start}.report-generated-at{font-size:12px;color:#667085;background:#f8fafc;border:1px solid #e4e7ec;border-radius:999px;padding:7px 11px;white-space:nowrap} .report-generated-at:has([data-report-build]){font-size:0}.report-generated-at [data-report-build]{display:none!important}.report-generated-at:has([data-report-build])>span{font-size:12px} .report-filter-card{padding:16px;margin-bottom:16px}.report-filter-summary{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}.report-filter-summary>div{display:flex;flex-direction:column;gap:3px}.report-filter-summary span{font-size:12px;color:#667085}.report-filter-mobile-toggle{display:none} .report-preset-list{display:flex;gap:8px;overflow-x:auto;padding:1px 1px 8px;scrollbar-width:thin}.report-preset{border:1px solid #d0d5dd;background:#fff;color:#344054;border-radius:999px;padding:8px 13px;font-weight:750;white-space:nowrap;cursor:pointer}.report-preset.active{background:var(--report-navy);border-color:var(--report-navy);color:#fff} .report-filter-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-top:4px}.report-filter-grid label{display:flex;flex-direction:column;gap:5px;font-size:12px;font-weight:700;color:#475467}.report-filter-grid input,.report-filter-grid select{width:100%;min-width:0;border:1px solid #d0d5dd;border-radius:8px;background:#fff;padding:9px 10px;color:#101828}.report-filter-grid input:disabled{background:#f2f4f7;color:#98a2b3} .report-filter-actions{display:flex;align-items:center;justify-content:flex-end;gap:9px;margin-top:12px}.report-filter-error{color:#b42318;font-size:12px;margin-right:auto}.report-warning{background:#fffaeb;border:1px solid #fedf89;color:#7a2e0e;border-radius:10px;padding:10px 12px;margin-bottom:14px;font-size:13px} .report-contract-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-bottom:14px}.report-contract-card{display:flex;flex-direction:column;gap:7px;min-height:124px;border-left:4px solid var(--report-navy)}.report-contract-card span{font-size:12px;color:#667085;font-weight:750}.report-contract-card strong{font-size:15px;color:#101828}.report-contract-card small{color:#667085;line-height:1.45} .report-state-card{text-align:center;padding:30px 18px}.report-state-icon{font-size:30px;color:var(--report-navy)}.report-state-card h2{font-size:18px;margin:10px 0 7px}.report-state-card p{max-width:680px;margin:0 auto;color:#667085;line-height:1.55}.report-state-actions{display:flex;justify-content:center;flex-wrap:wrap;gap:8px;margin-top:16px}.report-export-contract{display:flex;align-items:center;gap:12px;margin-top:14px}.report-export-contract span{font-size:12px;color:#667085} @media(max-width:900px){.report-foundation-panel{width:100%;overflow-x:clip}.report-shell-head{display:block}.report-generated-at{display:inline-block;margin-top:9px}.report-filter-mobile-toggle{display:inline-flex}.report-filter-body{display:none}.report-filter-open .report-filter-body{display:block}.report-filter-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.report-contract-grid{grid-template-columns:1fr}.report-contract-card{min-height:0}.report-export-contract{align-items:flex-start;flex-direction:column;gap:5px}} @media(max-width:430px){.report-filter-card{padding:13px}.report-filter-summary{margin-bottom:0}.report-filter-open .report-filter-summary{margin-bottom:12px}.report-filter-grid{grid-template-columns:1fr}.report-filter-actions{align-items:stretch;flex-wrap:wrap}.report-filter-error{width:100%}.report-filter-actions .btn{flex:1}.report-state-card{padding:24px 12px}.report-generated-at{white-space:normal}.report-preset{padding:7px 11px;font-size:12px}} /* PHASE R2 — Production report */ .report-date-note{margin:-4px 0 14px;padding:10px 12px;border-radius:9px;background:#eff8ff;color:#18496f;font-size:12px;border:1px solid #b2ddff}.r2-warning-red{background:#fef3f2;border-color:#fecdca;color:#912018}.r2-kpi-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-bottom:14px}.r2-kpi{appearance:none;text-align:left;cursor:pointer;min-height:118px;border:1px solid #dfe4ea;border-left:4px solid var(--report-navy);padding:16px;color:#101828}.r2-kpi span{display:block;color:#667085;font-size:12px;font-weight:750}.r2-kpi strong{display:block;margin-top:10px;font-size:25px;color:#101828}.r2-kpi small{display:block;min-height:17px;margin-top:6px;color:#667085;line-height:1.4}.r2-kpi:hover{border-color:#84caff;box-shadow:0 4px 16px rgba(0,67,124,.08)}.r2-skeleton{min-height:112px;background:linear-gradient(90deg,#f2f4f7,#fff,#f2f4f7);background-size:200% 100%;animation:r2pulse 1.2s linear infinite}@keyframes r2pulse{to{background-position:-200% 0}} .r2-chart-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.r2-block{margin-bottom:14px;padding:16px;min-width:0}.r2-block-head{display:flex;justify-content:space-between;gap:14px;align-items:flex-start;margin-bottom:14px}.r2-block-head h3{margin:0;color:#101828;font-size:18px}.r2-block-head p,.r2-muted{margin:4px 0 0;color:#667085;font-size:12px}.r2-legend{display:flex;gap:10px;flex-wrap:wrap;font-size:11px;color:#667085}.r2-legend span{display:flex;align-items:center;gap:5px}.r2-legend i{width:10px;height:10px;border-radius:2px;background:#aeb8c6}.r2-legend i.actual{background:#00437c} .r2-bars{display:flex;flex-direction:column;gap:10px}.r2-bar-row{appearance:none;border:0;background:transparent;padding:0;display:grid;grid-template-columns:minmax(105px,1fr) minmax(120px,3fr) 64px;gap:9px;align-items:center;text-align:left;cursor:pointer}.r2-bar-label{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:12px;font-weight:700;color:#344054}.r2-bar-track{height:32px;background:#f2f4f7;border-radius:7px;overflow:hidden;display:flex;flex-direction:column;justify-content:center;gap:2px;padding:3px}.r2-bar{display:block;height:11px;min-width:2px;border-radius:4px;background:#aeb8c6}.r2-bar-1{background:#00437c}.r2-bar-row>strong{text-align:right;font-size:12px}.r2-trend{height:245px;display:flex;align-items:flex-end;gap:8px;padding:12px 3px 0;border-bottom:1px solid #e4e7ec;overflow-x:auto}.r2-trend-point{height:100%;min-width:58px;flex:1;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;gap:4px}.r2-trend-point span{width:min(34px,70%);min-height:4px;background:#00437c;border-radius:6px 6px 0 0}.r2-trend-point small{font-size:9px;color:#667085;white-space:nowrap}.r2-trend-point strong{font-size:10px;color:#344054} .r2-fabric-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.r2-fabric-grid>div{border:1px solid #e4e7ec;background:#f9fafb;border-radius:9px;padding:12px}.r2-fabric-grid span{display:block;color:#667085;font-size:11px}.r2-fabric-grid strong{display:block;margin-top:5px;font-size:17px}.r2-list-actions{display:flex;gap:8px}.r2-list-actions select{border:1px solid #d0d5dd;border-radius:8px;padding:7px;background:white}.r2-block .report-table-scroll{max-width:100%;overflow:auto}.r2-block table{width:100%;border-collapse:collapse;min-width:980px}.r2-block th,.r2-block td{padding:10px;border-bottom:1px solid #e4e7ec;text-align:left;font-size:12px;vertical-align:top}.r2-block th{color:#667085;background:#f9fafb;white-space:nowrap}.r2-badge{display:inline-flex;margin:3px 0 0;border-radius:999px;background:#f2f4f7;color:#475467;padding:3px 7px;font-size:10px;font-weight:750;white-space:nowrap}.r2-badge.success{background:#ecfdf3;color:#027a48}.r2-badge.danger{background:#fef3f2;color:#b42318}.r2-over{box-shadow:inset 3px 0 #d92d20}.r2-mobile-list{display:none}.r2-production-card{padding:13px;cursor:pointer}.r2-production-card>div{display:flex;justify-content:space-between;gap:8px}.r2-production-card p{margin:6px 0;color:#475467;font-size:12px}.r2-production-card dl{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:10px 0 0}.r2-production-card dl div{background:#f9fafb;border-radius:7px;padding:8px}.r2-production-card dt{font-size:10px;color:#667085}.r2-production-card dd{margin:3px 0 0;font-size:12px;font-weight:750}.report-pagination{display:flex;align-items:center;justify-content:flex-end;gap:9px;margin-top:12px;font-size:12px}.report-pagination button:disabled{opacity:.45}.r2-filter-grid{grid-template-columns:repeat(4,minmax(0,1fr))} @media(max-width:900px){.r2-kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.r2-chart-grid{grid-template-columns:1fr}.r2-fabric-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.r2-filter-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.r2-desktop-list{display:none}.r2-mobile-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.r2-block{padding:13px}.r2-block table{min-width:840px}} @media(max-width:430px){.r2-kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.r2-kpi{padding:11px;min-height:96px}.r2-kpi strong{font-size:20px}.r2-kpi small{font-size:9px}.r2-filter-grid{grid-template-columns:1fr}.r2-mobile-list{grid-template-columns:1fr}.r2-bar-row{grid-template-columns:88px minmax(100px,1fr) 50px}.r2-trend{height:220px}.r2-fabric-grid{grid-template-columns:1fr 1fr}.r2-block-head{flex-direction:column}.r2-list-actions{width:100%}.r2-list-actions .btn{flex:1}.r2-production-card dl{grid-template-columns:1fr 1fr}} @media(max-width:340px){.r2-kpi-grid{grid-template-columns:1fr}.r2-fabric-grid{grid-template-columns:1fr}} /* PHASE R3 — Inventory report */ .ir3-tabs{display:flex;gap:8px;overflow-x:auto;margin:0 0 14px;padding-bottom:4px}.ir3-tabs button{border:1px solid #d0d5dd;background:#fff;border-radius:999px;padding:9px 13px;white-space:nowrap;font-weight:750;cursor:pointer}.ir3-tabs button.active{background:#00437c;color:#fff;border-color:#00437c}.ir3-movement{display:grid;gap:7px}.ir3-movement>div{display:flex;justify-content:space-between;gap:10px;border-bottom:1px solid #e4e7ec;padding:7px 0;font-size:12px}.ir3-movement span{color:#667085}.ir3-movement strong{white-space:nowrap}.ir3-desktop table{min-width:1050px} @media(max-width:900px){.ir3-desktop{display:none}.report-foundation-panel#reportWarehouse .r2-mobile-list{display:grid}.report-foundation-panel#reportWarehouse .r2-chart-grid{grid-template-columns:1fr}} /* PHASE R4 — Purchase report */ .r4-desktop table{min-width:1350px}.report-foundation-panel#reportPurchase .r2-production-card{cursor:default} @media(max-width:900px){.r4-desktop{display:none}.report-foundation-panel#reportPurchase .r2-mobile-list{display:grid}.report-foundation-panel#reportPurchase .r2-chart-grid{grid-template-columns:1fr}} #saasPlansSection,#saasOrdersSection{overflow:visible} .s6-head{display:flex;justify-content:space-between;gap:14px;align-items:flex-start;margin-bottom:14px}.s6-head h2{margin:0 0 5px;font-size:20px}.s6-muted{color:#667085;font-size:12px}.s6-plan-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.s6-plan{border:1px solid #d7dee8;border-radius:14px;padding:16px;background:#fff;box-shadow:0 5px 16px rgba(0,67,124,.06)}.s6-plan-top{display:flex;justify-content:space-between;gap:10px}.s6-plan h3{margin:0;font-size:18px}.s6-code{font:700 11px/1.2 monospace;color:#667085}.s6-price{font-size:22px;font-weight:850;color:#00437c;margin:13px 0 3px}.s6-plan-meta{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:14px 0}.s6-plan-meta div{background:#f5f8fb;border-radius:9px;padding:9px}.s6-plan-meta b{display:block;font-size:12px}.s6-plan-meta span{font-size:11px;color:#667085}.s6-tags{display:flex;gap:6px;flex-wrap:wrap}.s6-tag{padding:4px 7px;border-radius:999px;background:#eef5fb;color:#00437c;font-size:10px;font-weight:750}.s6-warn{color:#a15c00;background:#fff8e8;border:1px solid #ffd78a;border-radius:8px;padding:7px 9px;font-size:11px;margin-top:10px}.s6-toolbar{display:grid;grid-template-columns:minmax(220px,2fr) repeat(4,minmax(120px,1fr)) auto;gap:8px;margin:12px 0}.s6-toolbar input,.s6-toolbar select,.s6-form input,.s6-form select,.s6-form textarea{width:100%;min-height:38px;border:1px solid #cfd7e3;border-radius:8px;padding:7px 9px;background:#fff;color:#111827}.s6-table-wrap{overflow:auto;border:1px solid #e1e6ed;border-radius:11px}.s6-table{width:100%;border-collapse:collapse;min-width:1180px}.s6-table th,.s6-table td{padding:10px;border-bottom:1px solid #e6e9ee;text-align:left;vertical-align:top;font-size:11px}.s6-table th{background:#f7f9fc;color:#475467;position:sticky;top:0}.s6-status{display:inline-flex;padding:4px 7px;border-radius:999px;font-size:10px;font-weight:800;background:#eef2f6}.s6-status.active,.s6-status.paid{background:#e8f8ef;color:#087443}.s6-status.trial,.s6-status.partial{background:#eaf3ff;color:#0058a3}.s6-status.expired,.s6-status.past_due{background:#fff0ef;color:#b42318}.s6-status.legacy_review{background:#fff4df;color:#9a5b00}.s6-pagination{display:flex;justify-content:space-between;align-items:center;margin-top:10px}.s6-mobile-list{display:none}.s6-mobile-card{border:1px solid #d8dee8;border-radius:12px;padding:13px;margin-bottom:10px}.s6-mobile-card header{display:flex;justify-content:space-between;gap:8px}.s6-mobile-card dl{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:11px 0}.s6-mobile-card dt{color:#667085;font-size:10px}.s6-mobile-card dd{margin:2px 0 0;font-weight:750}.s6-modal{position:fixed;inset:0;background:rgba(15,23,42,.62);z-index:10050;display:flex;align-items:center;justify-content:center;padding:16px}.s6-modal[hidden]{display:none}.s6-dialog{background:#fff;border-radius:15px;width:min(900px,100%);max-height:92vh;overflow:auto;padding:18px}.s6-dialog-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;margin-bottom:14px}.s6-dialog-head h2{margin:0}.s6-form{display:grid;grid-template-columns:1fr 1fr;gap:12px}.s6-field.span2{grid-column:1/-1}.s6-field label{display:block;font-size:11px;font-weight:750;margin-bottom:5px}.s6-confirm{background:#f6f8fb;border:1px solid #dce2eb;border-radius:10px;padding:12px;margin:13px 0}.s6-module-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;max-height:260px;overflow:auto}.s6-module-grid label{display:flex;align-items:center;gap:7px;border:1px solid #d8dee8;border-radius:8px;padding:7px;font-size:11px}.s6-module-grid input{width:auto;min-height:0}.s6-feature-row{display:grid;grid-template-columns:1fr 1fr auto;gap:7px;margin-bottom:7px}.s6-detail-tabs{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:12px}.s6-detail-actions{display:flex;gap:7px;flex-wrap:wrap;margin:12px 0}.s6-empty,.s6-error{padding:24px;text-align:center;color:#667085}.s6-error{color:#b42318}.s6-loading{height:110px;border-radius:12px;background:linear-gradient(90deg,#f2f4f7,#e7ebf0,#f2f4f7);background-size:200% 100%;animation:s6load 1.3s infinite}@keyframes s6load{to{background-position:-200% 0}} @media(max-width:900px){.s6-plan-grid{grid-template-columns:1fr}.s6-toolbar{grid-template-columns:1fr 1fr}.s6-toolbar>*:first-child{grid-column:1/-1}.s6-module-grid{grid-template-columns:1fr 1fr}} @media(max-width:600px){.s6-head{align-items:stretch;flex-direction:column}.s6-head .btn{width:100%}.s6-plan{padding:13px}.s6-plan-meta{grid-template-columns:1fr 1fr}.s6-plan-meta div:last-child{grid-column:1/-1}.s6-toolbar{grid-template-columns:1fr 1fr}.s6-table-wrap{display:none}.s6-mobile-list{display:block}.s6-pagination{gap:8px;flex-wrap:wrap}.s6-dialog{padding:14px}.s6-form{grid-template-columns:1fr}.s6-field.span2{grid-column:auto}.s6-module-grid{grid-template-columns:1fr}.s6-feature-row{grid-template-columns:1fr 1fr auto}.s6-detail-actions .btn{flex:1 1 45%}} .s6-module-toolbar{display:flex;justify-content:space-between;gap:10px;align-items:center;margin-bottom:9px}.s6-module-toolbar label{margin:0}.s6-module-summary{font-size:11px;color:#667085}.s6-module-groups{display:grid;gap:8px;max-height:420px;overflow:auto;padding-right:3px}.s6-module-group{border:1px solid #d8dee8;border-radius:10px;background:#fff}.s6-module-group summary{display:flex;align-items:center;gap:8px;padding:10px;cursor:pointer;background:#f7f9fc;border-radius:10px;font-size:12px;list-style:none}.s6-module-group summary::-webkit-details-marker{display:none}.s6-module-group summary:after{content:'▾';margin-left:auto;color:#667085}.s6-module-group:not([open]) summary:after{content:'›'}.s6-module-group summary input,.s6-module-grid input{width:auto;min-height:0}.s6-module-group .s6-module-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;max-height:none;overflow:visible;padding:9px}.s6-module-group .s6-module-grid label{display:flex;align-items:center;gap:7px;border:1px solid #e1e6ed;border-radius:8px;padding:8px;font-size:11px;margin:0}.s6-module-group .s6-module-grid label.selected{border-color:#75a8d0;background:#eef6fc;color:#00437c}@media(max-width:600px){.s6-module-toolbar{align-items:flex-start;flex-direction:column}.s6-module-group .s6-module-grid{grid-template-columns:1fr}} .s7-section{scroll-margin-top:16px}.s7-card{background:#fff;border:1px solid #d8e0ea;border-radius:16px;padding:18px;margin:16px 0;box-shadow:0 4px 16px rgba(0,67,124,.06)} .s7-head{display:flex;gap:12px;justify-content:space-between;align-items:flex-start;margin-bottom:14px}.s7-head h2,.s7-head h3{margin:0;color:#0f172a}.s7-muted{color:#64748b;font-size:13px}.s7-kpis{display:grid;grid-template-columns:repeat(5,minmax(150px,1fr));gap:10px}.s7-kpi{border:1px solid #d8e0ea;border-left:5px solid #00437c;border-radius:12px;padding:12px;background:#fff}.s7-kpi b{display:block;font-size:22px;color:#0f172a}.s7-kpi span{display:block;color:#64748b;font-size:12px;margin-top:4px} .s7-filters{display:grid;grid-template-columns:2fr repeat(4,minmax(130px,1fr));gap:9px;margin:14px 0}.s7-filters input,.s7-filters select,.s7-page select{min-height:40px;border:1px solid #cbd5e1;border-radius:9px;padding:7px 9px;background:#fff;color:#0f172a}.s7-filter-flags{display:flex;flex-wrap:wrap;gap:8px;grid-column:1/-1}.s7-filter-flags label{display:flex;align-items:center;gap:6px;border:1px solid #d8e0ea;border-radius:999px;padding:7px 10px;font-size:12px} .s7-table-wrap,.s7-compare-wrap{overflow-x:auto;max-width:100%;border:1px solid #e2e8f0;border-radius:12px}.s7-table{border-collapse:collapse;width:100%;min-width:1160px}.s7-table th,.s7-table td{padding:11px;border-bottom:1px solid #e2e8f0;text-align:left;vertical-align:top}.s7-table th{background:#f4f7fb;color:#334155;font-size:12px;position:sticky;top:0}.s7-progress{height:7px;background:#e8edf3;border-radius:999px;overflow:hidden;margin-top:5px}.s7-progress i{display:block;height:100%;background:#0b815d;border-radius:inherit}.s7-progress.warn i{background:#e67e00}.s7-progress.danger i{background:#c62828}.s7-badge{display:inline-flex;border-radius:999px;padding:4px 8px;font-size:11px;font-weight:700;background:#eef4fb;color:#00437c}.s7-badge.warn{background:#fff3dc;color:#9a5700}.s7-badge.danger{background:#fee8e7;color:#b42318}.s7-badge.gray{background:#eef1f5;color:#5d6674}.s7-page{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:12px}.s7-mobile-list{display:none} .s7-layers{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.s7-layer{border:1px solid #d8e0ea;border-radius:12px;padding:12px}.s7-layer strong{color:#00437c}.s7-plan-warning{margin:5px 0;padding:7px 9px;border-radius:8px;background:#fff3dc;color:#8a4b00;font-size:12px}.s7-yes{color:#0b815d;font-weight:800}.s7-no{color:#94a3b8}.s7-feature-code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px}.s7-error,.s7-empty{padding:28px;text-align:center;color:#64748b}.s7-loading{height:110px;border-radius:12px;background:linear-gradient(90deg,#eef2f7 25%,#f8fafc 37%,#eef2f7 63%);background-size:400% 100%;animation:s7load 1.3s infinite}@keyframes s7load{0%{background-position:100% 0}100%{background-position:0 0}} .s7-modal{position:fixed;inset:0;z-index:10020;background:rgba(15,23,42,.55);display:grid;place-items:center;padding:16px}.s7-modal[hidden]{display:none}.s7-dialog{background:#fff;border-radius:16px;padding:18px;width:min(680px,100%);max-height:88vh;overflow:auto}.s7-detail-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.s7-detail-grid>div{border:1px solid #e2e8f0;border-radius:10px;padding:10px} @media(max-width:900px){.s7-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.s7-filters{grid-template-columns:1fr 1fr}.s7-layers{grid-template-columns:1fr}.s7-table-wrap.usage{display:none}.s7-mobile-list{display:grid;gap:10px}.s7-tenant-card{border:1px solid #d8e0ea;border-radius:12px;padding:12px}.s7-tenant-card h3{font-size:15px;margin:0 0 4px}.s7-tenant-metrics{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:10px 0}.s7-tenant-metrics>div{background:#f7f9fc;border-radius:9px;padding:8px}.s7-compare-wrap{max-width:calc(100vw - 42px)}.s7-head{align-items:center}} @media(max-width:480px){.s7-card{padding:12px;border-radius:13px}.s7-kpis{gap:7px}.s7-kpi{padding:9px}.s7-kpi b{font-size:18px}.s7-filters{grid-template-columns:1fr}.s7-detail-grid{grid-template-columns:1fr}.s7-page{align-items:flex-start;flex-direction:column}.s7-filter-flags{grid-column:auto}} .s8-audit{display:grid;gap:16px;color:#101828}.s8-audit *{box-sizing:border-box}.s8-head{display:flex;justify-content:space-between;gap:16px;align-items:flex-start}.s8-head h2{margin:0 0 5px;font-size:24px}.s8-muted{color:#667085}.s8-filters{display:grid;grid-template-columns:minmax(240px,2fr) repeat(5,minmax(135px,1fr));gap:10px;padding:16px;border:1px solid #d0d5dd;border-radius:14px;background:#fff}.s8-field{display:grid;gap:5px;font-size:12px;font-weight:700;color:#475467}.s8-field input,.s8-field select{width:100%;height:40px;border:1px solid #d0d5dd;border-radius:9px;padding:0 10px;background:#fff;color:#101828}.s8-filter-actions{display:flex;gap:8px;align-items:end;grid-column:1/-1}.s8-summary,.s8-pager{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}.s8-summary select{height:34px;border:1px solid #d0d5dd;border-radius:8px}.s8-table-wrap{overflow:auto;border:1px solid #e4e7ec;border-radius:12px;background:#fff}.s8-table{width:100%;min-width:1120px;border-collapse:collapse}.s8-table th,.s8-table td{padding:11px 12px;border-bottom:1px solid #eaecf0;text-align:left;vertical-align:top;font-size:13px}.s8-table th{background:#f8fafc;color:#475467;font-size:12px;position:sticky;top:0}.s8-strong{font-weight:800}.s8-code{font:11px ui-monospace,SFMono-Regular,Consolas,monospace;color:#667085;word-break:break-all}.s8-badge{display:inline-flex;padding:4px 8px;border-radius:999px;background:#eef2f6;color:#344054;font-size:11px;font-weight:800}.s8-badge.info{background:#eaf4ff;color:#00437c}.s8-badge.warning{background:#fff4e5;color:#b54708}.s8-badge.critical{background:#fee4e2;color:#b42318}.s8-link{border:0;background:none;padding:0;color:#005a9c;font-weight:750;cursor:pointer;text-align:left}.s8-mobile{display:none}.s8-empty,.s8-error,.s8-skeleton{padding:32px;border:1px solid #e4e7ec;border-radius:12px;background:#fff;text-align:center}.s8-skeleton{min-height:180px;background:linear-gradient(90deg,#f2f4f7 25%,#fff 37%,#f2f4f7 63%);background-size:400% 100%;animation:s8pulse 1.4s infinite}@keyframes s8pulse{0%{background-position:100%}100%{background-position:0}}.s8-modal{position:fixed;inset:0;z-index:10030;background:rgba(16,24,40,.56);display:grid;place-items:center;padding:18px}.s8-dialog{width:min(980px,100%);max-height:90vh;overflow:auto;background:#fff;border-radius:16px;box-shadow:0 24px 60px rgba(0,0,0,.28)}.s8-dialog-head{position:sticky;top:0;z-index:2;display:flex;justify-content:space-between;gap:12px;padding:16px 18px;border-bottom:1px solid #eaecf0;background:#fff}.s8-dialog-head h3{margin:0}.s8-close{border:0;background:#f2f4f7;border-radius:8px;width:36px;height:36px;font-size:22px;cursor:pointer}.s8-detail{padding:18px;display:grid;gap:16px}.s8-meta{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.s8-meta div{padding:10px;border:1px solid #eaecf0;border-radius:10px}.s8-meta span{display:block;font-size:11px;color:#667085}.s8-diff{display:grid;grid-template-columns:1fr 1fr;gap:12px}.s8-json{margin:6px 0 0;max-height:360px;overflow:auto;white-space:pre-wrap;word-break:break-word;background:#101828;color:#f2f4f7;padding:12px;border-radius:10px;font:12px/1.5 ui-monospace,SFMono-Regular,Consolas,monospace}.s8-changes{display:flex;gap:6px;flex-wrap:wrap}.s8-old{background:#fff1f0;color:#b42318}.s8-new{background:#ecfdf3;color:#027a48}.s8-preflight-legacy{margin-top:18px}.s8-preflight-legacy summary{cursor:pointer;font-weight:800;color:#475467} @media(max-width:1100px){.s8-filters{grid-template-columns:repeat(3,minmax(0,1fr))}} @media(max-width:700px){.s8-head{display:block}.s8-head .btn{margin-top:10px}.s8-filters{grid-template-columns:1fr 1fr;padding:12px}.s8-field:first-child{grid-column:1/-1}.s8-table-wrap{display:none}.s8-mobile{display:grid;gap:10px}.s8-card{border:1px solid #d0d5dd;border-left:5px solid #00437c;border-radius:12px;padding:13px;background:#fff;display:grid;gap:9px}.s8-card-top{display:flex;justify-content:space-between;gap:8px}.s8-card-row{display:flex;justify-content:space-between;gap:10px}.s8-card-row span{color:#667085}.s8-card-row strong{text-align:right}.s8-meta{grid-template-columns:1fr 1fr}.s8-diff{grid-template-columns:1fr}.s8-dialog{max-height:94vh}.s8-pager{justify-content:center}.s8-summary{align-items:flex-start}.s8-filter-actions{grid-column:1/-1}} @media(max-width:390px){.s8-filters{grid-template-columns:1fr}.s8-field:first-child{grid-column:auto}.s8-meta{grid-template-columns:1fr}} .s8b{display:grid;gap:16px;color:#101828}.s8b *{box-sizing:border-box}.s8b-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}.s8b-head h2{margin:0 0 4px}.s8b-actions{display:flex;gap:8px;flex-wrap:wrap}.s8b-muted{color:#667085}.s8b-filters{display:grid;grid-template-columns:minmax(230px,2fr) repeat(5,minmax(130px,1fr));gap:10px;padding:15px;border:1px solid #d0d5dd;border-radius:14px;background:#fff}.s8b-field{display:grid;gap:5px;font-size:12px;font-weight:750;color:#475467}.s8b-field input,.s8b-field select,.s8b-field textarea{width:100%;border:1px solid #d0d5dd;border-radius:9px;background:#fff;color:#101828;padding:9px 10px}.s8b-field input,.s8b-field select{height:40px}.s8b-filter-actions{grid-column:1/-1;display:flex;gap:8px}.s8b-summary,.s8b-pager{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}.s8b-table-wrap{overflow:auto;border:1px solid #e4e7ec;border-radius:12px}.s8b-table{width:100%;min-width:1200px;border-collapse:collapse;background:#fff}.s8b-table th,.s8b-table td{padding:10px 11px;border-bottom:1px solid #eaecf0;text-align:left;vertical-align:top;font-size:13px}.s8b-table th{background:#f8fafc;color:#475467;position:sticky;top:0}.s8b-code{font:11px ui-monospace,SFMono-Regular,Consolas,monospace;color:#667085;word-break:break-all}.s8b-title{font-weight:800}.s8b-badge{display:inline-flex;padding:4px 8px;border-radius:999px;background:#eef2f6;color:#344054;font-size:11px;font-weight:800}.s8b-badge.critical,.s8b-badge.closed{background:#fee4e2;color:#b42318}.s8b-badge.high,.s8b-badge.investigating,.s8b-badge.in_progress{background:#fff4e5;color:#b54708}.s8b-badge.medium,.s8b-badge.waiting_customer{background:#fef0c7;color:#93370d}.s8b-badge.low,.s8b-badge.resolved{background:#ecfdf3;color:#027a48}.s8b-link{border:0;background:none;color:#005a9c;font-weight:750;padding:0;cursor:pointer;text-align:left}.s8b-mobile{display:none}.s8b-empty,.s8b-error,.s8b-skeleton{padding:32px;text-align:center;border:1px solid #e4e7ec;border-radius:12px;background:#fff}.s8b-skeleton{min-height:180px;background:linear-gradient(90deg,#f2f4f7 25%,#fff 37%,#f2f4f7 63%);background-size:400% 100%;animation:s8bpulse 1.4s infinite}@keyframes s8bpulse{0%{background-position:100%}100%{background-position:0}}.s8b-modal{position:fixed;inset:0;z-index:10040;background:rgba(16,24,40,.58);display:grid;place-items:center;padding:18px}.s8b-dialog{width:min(900px,100%);max-height:92vh;overflow:auto;background:#fff;border-radius:16px}.s8b-dialog-head{position:sticky;top:0;z-index:3;background:#fff;border-bottom:1px solid #eaecf0;padding:15px 18px;display:flex;justify-content:space-between;gap:10px}.s8b-dialog-head h3{margin:0}.s8b-close{border:0;background:#f2f4f7;border-radius:8px;width:36px;height:36px;font-size:22px;cursor:pointer}.s8b-form{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding:18px}.s8b-span{grid-column:1/-1}.s8b-form-actions{grid-column:1/-1;display:flex;justify-content:flex-end;gap:8px}.s8b-detail{padding:18px;display:grid;gap:16px}.s8b-meta{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.s8b-meta>div{border:1px solid #eaecf0;border-radius:10px;padding:10px}.s8b-meta span{display:block;font-size:11px;color:#667085}.s8b-description{white-space:pre-wrap;word-break:break-word;padding:13px;background:#f8fafc;border-radius:10px}.s8b-timeline{display:grid;gap:10px}.s8b-event{border-left:3px solid #00437c;padding:8px 11px;background:#f8fafc;border-radius:0 9px 9px 0}.s8b-event-head{display:flex;justify-content:space-between;gap:8px}.s8b-event-note{white-space:pre-wrap;word-break:break-word;margin-top:5px}.s8b-update{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;border:1px solid #d0d5dd;border-radius:12px;padding:13px}.s8b-update .note{grid-column:1/-1}.s8b-update-actions{grid-column:1/-1}.s8b-card{display:grid;gap:8px;border:1px solid #d0d5dd;border-left:5px solid #00437c;border-radius:12px;padding:13px;background:#fff}.s8b-card-head,.s8b-card-row{display:flex;justify-content:space-between;gap:10px}.s8b-card-row span{color:#667085}.s8b-card-row strong{text-align:right} @media(max-width:1100px){.s8b-filters{grid-template-columns:repeat(3,1fr)}} @media(max-width:700px){.s8b-head{display:block}.s8b-actions{margin-top:10px}.s8b-filters{grid-template-columns:1fr 1fr;padding:12px}.s8b-field:first-child{grid-column:1/-1}.s8b-table-wrap{display:none}.s8b-mobile{display:grid;gap:10px}.s8b-meta{grid-template-columns:1fr 1fr}.s8b-form{grid-template-columns:1fr}.s8b-span,.s8b-form-actions{grid-column:auto}.s8b-update{grid-template-columns:1fr}.s8b-update .note,.s8b-update-actions{grid-column:auto}.s8b-dialog{max-height:95vh}} @media(max-width:390px){.s8b-filters,.s8b-meta{grid-template-columns:1fr}.s8b-field:first-child{grid-column:auto}} .s8c-wrap{display:grid;gap:16px}.s8c-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}.s8c-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.s8c-card{background:#fff;border:1px solid #d8dee8;border-radius:14px;padding:16px;min-width:0}.s8c-card h3{margin:0 0 5px;color:#0b1b33}.s8c-card .muted{color:#667085;font-size:13px}.s8c-row{display:grid;grid-template-columns:minmax(145px,.8fr) minmax(180px,1.2fr) auto;gap:10px;align-items:center;padding:11px 0;border-top:1px solid #edf0f4}.s8c-row:first-of-type{margin-top:12px}.s8c-row label{font-weight:700;color:#344054}.s8c-row input,.s8c-row select,.s8c-row textarea{width:100%;box-sizing:border-box;border:1px solid #cfd6e2;border-radius:9px;padding:9px 10px;background:#fff;color:#111827}.s8c-row textarea{min-height:72px;resize:vertical}.s8c-contract{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:12px}.s8c-contract>div{border:1px solid #e2e8f0;border-radius:10px;padding:11px;background:#f8fafc}.s8c-warn{border-left:4px solid #e67e00;background:#fff8e8;padding:10px 12px;border-radius:8px;color:#7a4300}.s8c-danger{border-left:4px solid #c53030;background:#fff5f5;padding:10px 12px;border-radius:8px;color:#822727}.s8c-status{font-size:13px;min-height:18px}.s8c-status.ok{color:#087443}.s8c-status.error{color:#b42318}.s8c-pill{display:inline-flex;padding:3px 8px;border-radius:999px;background:#e9f2fb;color:#00437c;font-size:12px;font-weight:700}.s8c-full{grid-column:1/-1}.s8c-public-notice{position:sticky;top:0;z-index:1200;padding:10px 16px;text-align:center;font-weight:800;background:#fff3cd;color:#6b4700;border-bottom:1px solid #f0cf76}.s8c-public-notice.release{background:#e7f2ff;color:#00437c;border-color:#9ac5ed} @media(max-width:760px){.s8c-grid{grid-template-columns:1fr}.s8c-row{grid-template-columns:1fr}.s8c-contract{grid-template-columns:1fr}.s8c-head{display:block}.s8c-head button{margin-top:10px}.s8c-full{grid-column:auto}} .fabric-stocktake-dialog{width:min(1480px,96vw);max-width:1480px;height:min(92vh,980px);display:flex;flex-direction:column;overflow:hidden}.fabric-stocktake-body{padding:16px;overflow:auto;min-height:0}.fabric-stocktake-toolbar{display:flex;gap:10px;align-items:center;justify-content:space-between;flex-wrap:wrap;margin-bottom:12px}.fabric-stocktake-summary{display:grid;grid-template-columns:repeat(7,minmax(120px,1fr));gap:9px;margin-bottom:14px}.fabric-stocktake-summary>div{border:1px solid var(--line);border-radius:10px;padding:10px;background:var(--card,#fff)}.fabric-stocktake-summary span{display:block;font-size:11px;color:var(--muted)}.fabric-stocktake-summary strong{display:block;margin-top:4px}.fabric-stocktake-table-wrap{overflow:auto;border:1px solid var(--line);border-radius:12px}.fabric-stocktake-table{width:100%;border-collapse:collapse;min-width:980px}.fabric-stocktake-table th,.fabric-stocktake-table td{padding:9px;border-bottom:1px solid var(--line);vertical-align:middle}.fabric-stocktake-table th{position:sticky;top:0;z-index:2;background:#111827;color:#fff}.fabric-stocktake-meter{width:135px;min-height:42px;font-size:16px;font-weight:700}.fabric-stocktake-row[data-result="match"]{background:var(--success-soft,#f1fbf5)}.fabric-stocktake-row[data-result="meter_variance"]{background:var(--warning-soft,#fff8e8)}.fabric-stocktake-row[data-result="missing_roll"]{background:var(--danger-soft,#fff1f1)}.fabric-stocktake-row[data-result="surplus_roll"]{background:#fff3dc}.fabric-stocktake-status{font-weight:800}.fabric-stocktake-status.match{color:var(--success,#16794b)}.fabric-stocktake-status.meter_variance,.fabric-stocktake-status.surplus_roll{color:var(--warning,#a15c00)}.fabric-stocktake-status.missing_roll{color:var(--danger,#b42318)}.fabric-stocktake-mobile{display:none}.fabric-stocktake-card{border:1px solid var(--line);border-radius:12px;padding:12px;margin-bottom:10px;background:#fff}.fabric-stocktake-card-head{display:flex;justify-content:space-between;gap:10px}.fabric-stocktake-card-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:10px 0}.fabric-stocktake-card-grid span{display:block;font-size:11px;color:var(--muted)}.fabric-stocktake-history{width:100%;border-collapse:collapse}.fabric-stocktake-history th,.fabric-stocktake-history td{padding:9px;border-bottom:1px solid var(--line);text-align:left}.fabric-stocktake-session-list{display:grid;gap:9px}.fabric-stocktake-session{display:flex;justify-content:space-between;gap:12px;align-items:center;border:1px solid var(--line);border-radius:11px;padding:11px}.fabric-stocktake-empty{padding:32px;text-align:center;color:var(--muted)} @media(max-width:900px){.fabric-stocktake-dialog{width:100vw;height:100dvh;max-height:none;border-radius:0}.fabric-stocktake-body{padding:12px}.fabric-stocktake-summary{grid-template-columns:repeat(2,minmax(0,1fr))}.fabric-stocktake-table-wrap{display:none}.fabric-stocktake-mobile{display:block}.fabric-stocktake-toolbar{align-items:stretch}.fabric-stocktake-toolbar>.actions,.fabric-stocktake-toolbar>select{width:100%}.fabric-stocktake-toolbar .btn{min-height:44px}.fabric-stocktake-meter{width:100%;min-height:48px;font-size:18px}.fabric-stocktake-session{align-items:flex-start;flex-direction:column}.fabric-stocktake-session .btn{width:100%}} .fabric-stocktake-create{border:1px solid var(--line);background:var(--card,#fff);border-radius:12px;padding:14px;margin-bottom:18px}.fabric-stocktake-create h3{margin:0 0 10px}.fabric-stocktake-form{display:grid;grid-template-columns:minmax(320px,2fr) 1fr 1fr auto;gap:10px;align-items:end}.fabric-stocktake-form label{font-size:12px;font-weight:700}.fabric-stocktake-form input,.fabric-stocktake-form select{display:block;width:100%;margin-top:5px;min-height:42px}.fabric-stocktake-compare{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:12px}.fabric-stocktake-compare section{border:1px solid var(--line);border-radius:12px;padding:14px;background:var(--card,#fff)}.fabric-stocktake-compare span{display:block;font-size:11px;color:var(--muted)}.fabric-stocktake-compare strong,.fabric-stocktake-compare b{display:inline-block;margin:6px 14px 0 0;font-size:18px}.fabric-document-lines{min-width:230px;padding-top:7px}.fabric-document-lines>div{display:flex;justify-content:space-between;gap:15px;padding:5px 0;border-bottom:1px solid var(--line)} @media(max-width:900px){.fabric-stocktake-form{grid-template-columns:1fr}.fabric-stocktake-compare{grid-template-columns:1fr 1fr}} .fabric-stocktake-body{display:flex;flex:1 1 auto;flex-direction:column;overflow:hidden;color:var(--text,#111827)}.fabric-stocktake-table-wrap{flex:1 1 260px;min-height:180px;height:min(55vh,560px);max-height:55vh;overflow-x:auto!important;overflow-y:scroll!important;overscroll-behavior:contain;scrollbar-gutter:stable;-webkit-overflow-scrolling:touch}.fabric-stocktake-table tbody td,.fabric-stocktake-history tbody td{color:var(--text,#111827);background:transparent}.fabric-stocktake-table tbody strong,.fabric-stocktake-history tbody strong{color:inherit}.fabric-stocktake-meter,.fabric-stocktake-form input,.fabric-stocktake-form select{background:var(--card,#fff);color:var(--text,#111827);border:1px solid var(--line,#d1d5db)}.fabric-stocktake-table thead th{color:#fff;background:#111827}.fabric-stocktake-session{color:var(--text,#111827);background:var(--card,#fff)} @media(max-width:900px){.fabric-stocktake-body{overflow-y:auto}.fabric-stocktake-table-wrap{display:none}.fabric-stocktake-card,.fabric-stocktake-card strong{color:var(--text,#111827)}} .fabric-stocktake-dialog .fabric-stocktake-table thead th,.fabric-stocktake-dialog .fabric-stocktake-history thead th,.fabric-stocktake-dialog .fabric-stocktake-session-table thead th{color:#111827!important;background:#f3f4f6!important;border-color:var(--line,#d1d5db)!important;text-shadow:none!important}.fabric-stocktake-session-table-wrap{overflow:auto;border:1px solid var(--line,#d1d5db);border-radius:12px}.fabric-stocktake-session-table{width:100%;min-width:1120px;border-collapse:collapse}.fabric-stocktake-session-table th,.fabric-stocktake-session-table td{padding:10px;text-align:left;border-bottom:1px solid var(--line,#d1d5db);color:var(--text,#111827);vertical-align:middle}.fabric-stocktake-session-table tbody tr:last-child td{border-bottom:0}.fabric-stocktake-session-status{font-weight:800;white-space:nowrap} @media(max-width:900px){.fabric-stocktake-session-table-wrap{border:0;overflow:visible}.fabric-stocktake-session-table{display:block;min-width:0}.fabric-stocktake-session-table thead{display:none}.fabric-stocktake-session-table tbody,.fabric-stocktake-session-table tr,.fabric-stocktake-session-table td{display:block}.fabric-stocktake-session-table tr{margin-bottom:12px;padding:10px;border:1px solid var(--line,#d1d5db);border-radius:12px;background:var(--card,#fff)}.fabric-stocktake-session-table td{display:grid;grid-template-columns:120px minmax(0,1fr);gap:8px;padding:6px;border:0}.fabric-stocktake-session-table td:before{content:attr(data-label);font-size:12px;color:var(--muted,#6b7280)}.fabric-stocktake-session-table td .btn{width:100%}} .accessory-stocktake-dialog{width:min(96vw,1180px);max-width:1180px;max-height:94vh;overflow:hidden}.accessory-stocktake-body{padding:18px;overflow:auto;max-height:calc(94vh - 86px);color:#111827;background:#fff}.accessory-stocktake-create{padding:16px;border:1px solid #d9dee8;border-radius:14px;margin-bottom:18px}.accessory-stocktake-form{display:grid;grid-template-columns:2fr 1.4fr 1fr 1.4fr auto;gap:12px;align-items:end;margin-bottom:16px}.accessory-stocktake-form label{display:grid;gap:6px;font-weight:700}.accessory-stocktake-form input,.accessory-stocktake-form select,.accessory-stocktake-table input{min-height:42px;padding:8px 10px;border:1px solid #aeb7c5;border-radius:8px;background:#fff!important;color:#111827!important;-webkit-text-fill-color:#111827!important}.accessory-stocktake-actions{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:16px}.accessory-stocktake-summary{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;margin-bottom:16px}.accessory-stocktake-summary>div{padding:14px;border:1px solid #d9dee8;border-radius:12px}.accessory-stocktake-summary span{display:block;color:#667085;margin-bottom:6px}.accessory-stocktake-summary strong{color:#111827}.accessory-stocktake-table{overflow:auto;border:1px solid #d9dee8;border-radius:12px}.accessory-stocktake-table table{width:100%;min-width:900px;border-collapse:collapse;background:#fff;color:#111827}.accessory-stocktake-table td{padding:12px;border-top:1px solid #e5e7eb;background:#fff!important;color:#111827!important;-webkit-text-fill-color:#111827!important}.accessory-stocktake-table td input{min-width:140px;margin-right:8px} html body #accessoryStocktakeModal.modal.open .accessory-stocktake-table table>thead>tr>th, html body #accessoryHistoryModal.modal.open .accessory-stocktake-table table>thead>tr>th{ background:#111827!important;background-color:#111827!important;color:#fff!important;-webkit-text-fill-color:#fff!important;border-color:#374151!important;padding:12px!important;text-align:center!important;vertical-align:middle!important;opacity:1!important } html body #accessoryStocktakeModal.modal.open .accessory-stocktake-table table>thead>tr>th *, html body #accessoryHistoryModal.modal.open .accessory-stocktake-table table>thead>tr>th *{color:#fff!important;-webkit-text-fill-color:#fff!important} html body #accessoryStocktakeModal.modal.open .accessory-stocktake-table table>tbody>tr>td, html body #accessoryHistoryModal.modal.open .accessory-stocktake-table table>tbody>tr>td{text-align:center!important;vertical-align:middle!important} .accessory-stocktake-check-control{display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:nowrap;white-space:nowrap} .accessory-stocktake-check-control input{width:140px;min-width:120px;margin:0!important;text-align:center} html body #accessoryStocktakeModal.modal.open button.btn.primary.accessory-stocktake-confirm, html body #accessoryStocktakeModal.modal.open button.btn.primary.accessory-stocktake-confirm *{background:#111827!important;background-color:#111827!important;color:#fff!important;-webkit-text-fill-color:#fff!important;border-color:#111827!important;opacity:1!important;white-space:nowrap!important} html body #accessoryStocktakeModal.modal.open button.btn.primary.accessory-stocktake-confirm:hover{background:#263244!important;background-color:#263244!important;color:#fff!important;-webkit-text-fill-color:#fff!important} @media(max-width:760px){.accessory-stocktake-dialog{width:100vw;max-width:100vw;max-height:100vh}.accessory-stocktake-body{max-height:calc(100vh - 78px);padding:12px}.accessory-stocktake-form{grid-template-columns:1fr}.accessory-stocktake-summary{grid-template-columns:1fr 1fr}.accessory-stocktake-table{overflow-x:auto;-webkit-overflow-scrolling:touch}} .fg-stocktake-dialog{width:min(96vw,1100px);max-width:1100px;max-height:94vh;overflow:hidden}.fg-stocktake-body{padding:18px;max-height:calc(94vh - 82px);overflow:auto;background:#fff;color:#111827}.fg-stocktake-create{border:1px solid #d9dee8;border-radius:14px;padding:16px;margin-bottom:18px}.fg-stocktake-form{display:grid;grid-template-columns:2fr 1.2fr 1fr 1.3fr auto;gap:10px;align-items:end}.fg-stocktake-form label{display:grid;gap:6px;font-weight:700}.fg-stocktake-form input,.fg-stocktake-form select,.fg-stocktake-input input{min-height:42px;padding:8px;border:1px solid #aeb7c5;border-radius:8px;background:#fff!important;color:#111827!important}.fg-stocktake-actions{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:16px}.fg-stocktake-table{overflow:auto;border:1px solid #d9dee8;border-radius:12px}.fg-stocktake-table table{width:100%;min-width:800px;border-collapse:collapse}.fg-stocktake-table th{background:#111827!important;color:#fff!important;-webkit-text-fill-color:#fff!important;text-align:center!important;padding:12px}.fg-stocktake-table td{background:#fff!important;color:#111827!important;-webkit-text-fill-color:#111827!important;text-align:center;padding:12px;border-top:1px solid #e5e7eb}.fg-stocktake-input{display:flex;align-items:center;justify-content:center;gap:8px;white-space:nowrap}.fg-stocktake-input input{width:120px;text-align:center}.fg-stocktake-input .btn.primary{background:#111827!important;color:#fff!important;-webkit-text-fill-color:#fff!important}@media(max-width:760px){.fg-stocktake-dialog{width:100vw;max-width:100vw;max-height:100vh}.fg-stocktake-body{max-height:calc(100vh - 76px);padding:10px}.fg-stocktake-form{grid-template-columns:1fr}.fg-stocktake-table{overflow-x:auto;-webkit-overflow-scrolling:touch}} html body #fgStocktakeV2Modal.modal.open .fg-stocktake-table table>thead>tr>th,html body #fgHistoryV2Modal.modal.open .fg-stocktake-table table>thead>tr>th{background:#111827!important;background-color:#111827!important;color:#fff!important;-webkit-text-fill-color:#fff!important;opacity:1!important} .workshop-stocktake-dialog{width:min(96vw,1180px);max-width:1180px;max-height:94vh;overflow:hidden}.workshop-stocktake-body{padding:18px;max-height:calc(94vh - 78px);overflow:auto;background:#fff;color:#111827}.workshop-stocktake-actions,.workshop-stocktake-form{display:flex;gap:10px;align-items:end;flex-wrap:wrap;margin-bottom:16px}.workshop-stocktake-form label{display:grid;gap:6px;min-width:210px;font-weight:700}.workshop-stocktake-form input,.workshop-stocktake-form select,.workshop-stocktake-table input{min-height:42px;border:1px solid #aeb7c5;border-radius:8px;background:#fff!important;color:#111827!important;padding:8px}.workshop-stocktake-table{overflow:auto;border:1px solid #d9dee8;border-radius:12px}.workshop-stocktake-table table{width:100%;min-width:980px;border-collapse:collapse}#workshopAccessoryStocktakeModal .workshop-stocktake-table thead,#workshopAccessoryStocktakeModal .workshop-stocktake-table thead tr,#workshopAccessoryStocktakeModal .workshop-stocktake-table thead th{background:#111827!important;color:#fff!important;-webkit-text-fill-color:#fff!important;text-align:center;padding:11px}#workshopAccessoryStocktakeModal .workshop-stocktake-table thead th *{color:#fff!important;-webkit-text-fill-color:#fff!important}.workshop-stocktake-table td{background:#fff!important;color:#111827!important;-webkit-text-fill-color:#111827!important;text-align:center;padding:10px;border-top:1px solid #e5e7eb}.workshop-stocktake-session-table table{min-width:1480px}.workshop-stocktake-check{display:flex;gap:7px;justify-content:center}.workshop-stocktake-check input{width:125px;text-align:right}.workshop-stocktake-note{padding:10px 12px;border-radius:9px;background:#fff8df;color:#624a00;margin-bottom:14px}@media(max-width:760px){.workshop-stocktake-dialog{width:100vw;max-width:100vw;max-height:100vh}.workshop-stocktake-body{max-height:calc(100vh - 72px);padding:10px}.workshop-stocktake-form{display:grid;grid-template-columns:1fr}.workshop-stocktake-form label{min-width:0}.workshop-stocktake-table{overflow-x:auto;-webkit-overflow-scrolling:touch}} #workshopAccessoryStocktakeModal .workshop-stocktake-check button[data-save]{background:#111827!important;border-color:#111827!important;color:#fff!important;-webkit-text-fill-color:#fff!important;font-weight:800!important;min-width:118px} #workshopAccessoryStocktakeModal .workshop-stocktake-check button[data-save].is-checked{background:#166534!important;border-color:#166534!important;color:#fff!important;-webkit-text-fill-color:#fff!important} #workshopAccessoryStocktakeModal .workshop-stocktake-check{gap:8px!important;align-items:center!important;min-width:310px!important} #workshopAccessoryStocktakeModal .workshop-stocktake-check input{width:150px!important;min-width:120px!important;flex:1 1 150px!important} #workshopAccessoryStocktakeModal .workshop-stocktake-check button[data-save]{font-family:inherit!important;font-size:13px!important;line-height:1.25!important;white-space:nowrap!important;overflow:visible!important;min-width:148px!important;flex:0 0 148px!important;padding:10px 12px!important} .roway-fg-excel-dialog{width:min(96vw,1500px)!important;max-width:1500px!important} .roway-fg-excel-toolbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:8px 0 12px} .roway-fg-excel-note{padding:11px 13px;border:1px solid #bfd2e4;background:#f0f7fc;color:#163b59;border-radius:8px;margin-bottom:12px} #finishedProductExcelSummary{grid-template-columns:repeat(5,minmax(120px,1fr));margin-bottom:12px} .roway-fg-excel-preview{max-height:56vh;overflow:auto;border:1px solid var(--line);border-radius:10px;background:#fff} .roway-fg-excel-preview table{min-width:1450px;margin:0} .roway-fg-excel-preview thead{position:sticky;top:0;z-index:2} .roway-fg-excel-preview th{background:#111827!important;color:#fff!important;-webkit-text-fill-color:#fff!important} .roway-fg-excel-preview td{vertical-align:top;color:#111827!important;-webkit-text-fill-color:#111827!important} .roway-fg-excel-errors{color:#b42318;margin-top:5px;font-size:12px;line-height:1.35} @media(max-width:700px){#finishedProductExcelSummary{grid-template-columns:repeat(2,minmax(0,1fr))}.roway-fg-excel-dialog{width:100vw!important;max-width:none!important;height:100dvh!important;border-radius:0!important}.roway-fg-excel-preview{max-height:52vh}} .roway-product-combobox{position:relative;width:100%;min-width:0} .roway-product-combobox-source{position:absolute!important;width:1px!important;height:1px!important;opacity:0!important;pointer-events:none!important;left:0!important;bottom:0!important} .roway-product-combobox-input{display:block!important;width:100%!important;height:40px!important;min-height:40px!important;margin:0!important;padding:7px 36px 7px 9px!important;box-sizing:border-box!important;border:1px solid #aeb7c5!important;border-radius:7px!important;background:#fff!important;color:#111827!important;-webkit-text-fill-color:#111827!important;font-size:13px!important} .roway-product-combobox-input:focus{outline:2px solid rgba(0,67,124,.2)!important;border-color:#00437c!important} .roway-product-combobox-toggle{position:absolute;right:1px;top:1px;width:34px;height:38px;border:0!important;border-left:1px solid #d6dbe3!important;border-radius:0 6px 6px 0!important;background:#fff!important;color:#111827!important;-webkit-text-fill-color:#111827!important;font-size:16px;z-index:2} .roway-product-combobox-menu{display:none;position:fixed;max-height:280px;overflow:auto;background:#fff;border:1px solid #aeb7c5;border-radius:8px;box-shadow:0 12px 28px rgba(15,23,42,.2);z-index:2147483000;text-align:left} .roway-product-combobox-menu.open{display:block} .roway-product-combobox-menu button{display:block;width:100%;border:0;border-bottom:1px solid #edf0f4;background:#fff;color:#111827;-webkit-text-fill-color:#111827;text-align:left;padding:9px 11px;cursor:pointer} .roway-product-combobox-menu button:last-child{border-bottom:0}.roway-product-combobox-menu button:hover,.roway-product-combobox-menu button.active{background:#eaf3fa!important}.roway-product-combobox-menu button[aria-selected="true"]{box-shadow:inset 3px 0 #00437c} .roway-product-combobox-menu strong,.roway-product-combobox-menu small{display:block;color:inherit!important;-webkit-text-fill-color:inherit!important}.roway-product-combobox-menu small{margin-top:3px;color:#667085!important;-webkit-text-fill-color:#667085!important} .roway-product-combobox-empty{padding:12px;color:#667085;background:#fff} #fgrReceiptModal .fgr-editor-product:has(.roway-product-combobox){overflow:visible!important;vertical-align:top!important;min-width:220px!important} #fgSaleRows td:has(.roway-product-combobox){overflow:visible!important;vertical-align:top!important;min-width:260px!important} #productionModal .field:has(#productionFinishedProduct){overflow:visible!important;min-width:220px!important} #issueModal .field:has(#issueProduct){overflow:visible!important} @media(max-width:700px){.roway-product-combobox-input{font-size:16px!important;height:44px!important;min-height:44px!important}.roway-product-combobox-toggle{height:42px}.roway-product-combobox-menu{max-height:min(52vh,420px)}} .fgr-pager-dock{position:static;z-index:24;background:#fff;border:1px solid #cfd5df;border-top:0;border-radius:0 0 8px 8px;box-shadow:0 -4px 12px rgba(16,24,40,.08)} .fgr-pager-dock .roway-table-pager{margin:0;padding:10px 12px} #finishedGoodsReceiptReport .fgr-toolbar{position:static!important;top:auto!important;z-index:auto!important} #fgrTableWrap.fgr-table-wrap{max-height:none!important;overflow-x:auto!important;overflow-y:visible!important;scrollbar-gutter:auto!important} .factory-accessory-history-filter{display:flex;align-items:flex-end;gap:10px;flex-wrap:wrap;margin:10px 0 14px} .factory-accessory-history-filter label{display:flex;flex-direction:column;gap:5px;font-size:12px;font-weight:700;color:#555} .factory-accessory-history-filter input{min-width:150px} .factory-accessory-history-count{align-self:center;color:#666;font-size:13px;margin-left:auto} /* STEP99 - Popup xuất vải: tiêu đề và bảng không tạo cuộn ngang giả. */ #issueModal>.dialog.issue-dialog-wide{overflow-x:hidden!important} #issueModal>.dialog.issue-dialog-wide>.section-title{min-width:0!important;max-width:100%!important;flex-wrap:wrap!important} #issueModal>.dialog.issue-dialog-wide>.section-title>span{min-width:0!important;max-width:100%!important;white-space:normal!important;overflow-wrap:anywhere!important} #issueModal .issue-matrix-wrap{scrollbar-gutter:auto!important} @media(min-width:901px){ #issueModal .issue-matrix-wrap{overflow-x:auto!important;overflow-y:visible!important;padding-bottom:0!important} #issueModal .issue-matrix{width:100%!important;min-width:0!important;max-width:100%!important;table-layout:fixed!important} } @media(max-width:900px){ #issueModal .issue-matrix-wrap{overflow-x:hidden!important;overflow-y:visible!important;padding-bottom:0!important} } /* STEP100 - Khóa tương phản hàng tiêu đề sau mọi quy tắc sticky dùng chung. */ #issueModal .issue-matrix-wrap table.issue-matrix>thead>tr:first-child>th{ background:#111827!important; background-color:#111827!important; color:#fff!important; -webkit-text-fill-color:#fff!important; border-color:#374151!important; box-shadow:0 1px 0 #374151,0 2px 5px rgba(16,24,40,.16)!important; } /* STEP101 - Bảng chọn cây không cuộn ngang; con lăn luôn đi theo chiều dọc popup. */ #issueModal .issue-matrix-wrap{ overflow-x:hidden!important; overflow-y:visible!important; max-height:none!important; padding-bottom:0!important; scrollbar-gutter:auto!important; touch-action:pan-y!important; overscroll-behavior-x:none!important; } #issueModal .issue-matrix{ width:100%!important; min-width:0!important; max-width:100%!important; table-layout:fixed!important; } /* STEP102 - Bảng vải về dùng cột 220px + 90px nên cột cố định thứ ba bắt đầu tại 310px. */ #detailModal .order-arrival-table th:nth-child(3), #detailModal .order-arrival-table td:nth-child(3){left:310px!important} /* STEP103 - Không giữ rãnh scrollbar dọc khi bảng vải về không có vùng cuộn riêng. */ #detailModal .order-arrival-block .inventory-matrix-wrap{ scrollbar-gutter:auto!important; overflow-y:visible!important; }