/* Keep the original wide tables scrollable without moving dialog actions
   underneath the floating message button on laptop-size windows. */
.el-dialog { max-width: calc(100vw - 32px) !important; }
.el-dialog__body { overflow-x: auto; }
.el-dialog__footer { position: sticky; bottom: 0; background: #fff; z-index: 2; }
.floating-container { z-index: 1000 !important; }
#local-migration-notice { top: 66px !important; bottom: auto !important; pointer-events: none; }
#local-migration-notice button { pointer-events: auto; }

/* Shared visual language with the Gami Takealot workspace. Keep the original
   Element UI table geometry and business controls intact. */
:root { --erp-primary:#5264e7; --erp-ink:#172033; --erp-muted:#758099; --erp-line:#e4e7ef; --erp-bg:#f6f7fb; }
html body { background:var(--erp-bg); color:var(--erp-ink); font-family:Arial,"Microsoft YaHei",sans-serif; }
body #app .app-wrapper { --current-color:#5264e7 !important; background:var(--erp-bg); }
body #app .app-main { background:var(--erp-bg); }
body #app .app-container { padding:24px; }
body #app .app-container:not(.home) { margin:20px; padding:22px; border:1px solid var(--erp-line); border-radius:16px; background:#fff; box-shadow:0 5px 22px #1e28460a; }
body #app .sidebar-container, body #app .sidebar-logo-container { background:#191f3a !important; }
body #app .sidebar-container { box-shadow:4px 0 24px #191f3a0b; }
body #app .sidebar-logo-container { border-bottom:1px solid #ffffff12; }
body #app .sidebar-logo-container .sidebar-title { color:#fff !important; font-size:18px; letter-spacing:.5px; }
body #app .sidebar-container .el-menu { background:transparent !important; }
body #app .sidebar-container .el-menu-item, body #app .sidebar-container .el-submenu__title { color:#b9c0db !important; background:transparent !important; border-radius:10px; margin:5px 10px; height:46px; line-height:46px; font-weight:500; }
body #app .sidebar-container .el-submenu__title i { color:#8f98b9; }
body #app .sidebar-container .el-menu-item:hover, body #app .sidebar-container .el-submenu__title:hover { background:#ffffff0d !important; color:#fff !important; }
body #app .sidebar-container .el-menu-item.is-active { background:#5969e9 !important; color:#fff !important; box-shadow:0 4px 14px #0b102633; }
body #app .sidebar-container .el-submenu.is-active > .el-submenu__title { color:#fff !important; }
body #app .sidebar-container .nest-menu .el-menu-item { font-size:13px; }
body #app .sidebar-container .el-submenu .el-menu-item { min-width:0 !important; background:transparent !important; }
body #app .sidebar-container .el-submenu .el-menu-item:hover { background:#ffffff0d !important; }
body #app .sidebar-container .el-submenu .el-menu-item.is-active { background:#5969e9 !important; color:#fff !important; }
body #app .hideSidebar .sidebar-container .el-menu-item, body #app .hideSidebar .sidebar-container .el-submenu__title { margin:5px 4px; }
body #app .hideSidebar .sidebar-container .el-submenu__title { padding-left:16px !important; }
body #app .sidebar-container .el-menu--collapse .el-tooltip { padding:0 16px !important; }
body #app .hideSidebar .sidebar-container .el-submenu > .el-submenu__title .svg-icon, body #app .hideSidebar .sidebar-container .submenu-title-noDropdown .el-tooltip .svg-icon { margin-left:0 !important; margin-right:0 !important; }
body .el-menu--vertical .el-menu--popup { background:#191f3a !important; border-radius:12px; padding:8px; box-shadow:0 10px 30px #191f3a26; }
body .el-menu--vertical .el-menu-item, body .el-menu--vertical .el-submenu__title { color:#b9c0db !important; background:transparent !important; border-radius:8px; }
body .el-menu--vertical .el-menu-item:hover, body .el-menu--vertical .el-menu-item.is-active, body .el-menu--vertical .el-submenu__title:hover { background:#5969e9 !important; color:#fff !important; }
body #app .navbar { box-shadow:none; border-bottom:1px solid var(--erp-line); background:#fff; }
body #app .navbar .right-menu-item, body #app .navbar .hamburger-container { color:#66728b; }
body #app .navbar .user-avatar { border-radius:12px; }
body #app .navbar .user-nickname { color:#33405c; font-weight:600; }
body #app .tags-view-container { background:#fff; border-bottom:1px solid var(--erp-line); box-shadow:none; }
body #app .tags-view-item { border:0; border-radius:6px 6px 0 0; color:#758099; padding:0 13px; background:transparent; }
body #app .tags-view-item.active { background:#eef0ff !important; color:#5264e7 !important; border-bottom:2px solid #5264e7 !important; }
body #app .tags-view-item.active:before { background:#5264e7; }
body .el-breadcrumb__inner a:hover, body .el-link.el-link--primary, body .el-button--text { color:#5264e7; }
body .el-form-item__label { color:#526079; font-weight:500; }
body .el-input__inner, body .el-textarea__inner { border-color:#d9deea; border-radius:9px; color:#25314a; background:#fff; }
body .el-input__inner:hover, body .el-textarea__inner:hover { border-color:#a9b3ce; }
body .el-input__inner:focus, body .el-textarea__inner:focus, body .el-select .el-input.is-focus .el-input__inner { border-color:#5167f6; box-shadow:0 0 0 3px #5167f61f; }
body .el-input.is-disabled .el-input__inner, body .el-textarea.is-disabled .el-textarea__inner { background:#f6f7fb; color:#78839b; }
body .el-button { border-radius:9px; font-weight:600; border-color:#dfe3ed; transition:background .16s,border-color .16s,box-shadow .16s; }
body .el-button:focus-visible, body a:focus-visible { outline:3px solid #a6b0ff; outline-offset:3px; }
body .el-button:not(.is-disabled):hover { color:#5264e7; border-color:#b6bff6; background:#f2f4ff; }
body .el-button--primary { background:#5264e7; border-color:#5264e7; color:white; }
body .el-button--primary:not(.is-disabled):hover, body .el-button--primary:not(.is-disabled):focus { background:#4354d3; border-color:#4354d3; color:white; }
body .el-button--primary.is-plain { background:#eef0ff; border-color:#d9dffd; color:#5264e7; }
body .el-button--success { background:#199c72; border-color:#199c72; color:#fff; }
body .el-button--success.is-plain { background:#ecfbf3; border-color:#bcebd4; color:#18885f; }
body .el-button--warning { background:#d99729; border-color:#d99729; color:white; }
body .el-button--warning.is-plain { background:#fff8e9; border-color:#f3dfb3; color:#ac741b; }
body .el-button--danger { background:#dd6475; border-color:#dd6475; color:white; }
body .el-button--danger.is-plain { background:#fff0f2; border-color:#f5cbd3; color:#cc5366; }
body .el-button--success:not(.is-disabled):hover { background:#178764; border-color:#178764; color:#fff; }
body .el-button--warning:not(.is-disabled):hover { background:#bd7c1a; border-color:#bd7c1a; color:#fff; }
body .el-button--danger:not(.is-disabled):hover { background:#c74e61; border-color:#c74e61; color:#fff; }
body .el-button.is-disabled { opacity:.55; }
body .el-button--text, body .el-button--text:not(.is-disabled):hover { border-color:transparent; background:transparent; }
body .el-table { color:#34415b; border-color:#e8ebf3; border-radius:10px; }
body .el-table .el-table__header-wrapper th, body .el-table .el-table__fixed-header-wrapper th { background:#f5f6fc !important; color:#526079; font-weight:600; border-color:#e8ebf3; }
body .el-table td, body .el-table th.is-leaf { border-color:#edf0f5; }
body .el-table--enable-row-hover .el-table__body tr:hover > td, body .el-table__body tr.hover-row > td { background:#f3f5ff !important; }
body .el-table__body tr.current-row > td { background:#eef0ff !important; }
body .el-table__footer-wrapper td { background:#f0f3ff !important; color:#4658b7; font-weight:700; }
body .el-table .cell { line-height:24px; }
body .el-table__empty-text { color:#8c96ab; }
body .pagination-container { background:transparent; padding-top:22px; }
body .el-pagination.is-background .el-pager li { border-radius:7px; background:#f0f2f8; }
body .el-pagination.is-background .el-pager li:not(.disabled).active { background:#5264e7; }
body .el-pagination button { border-radius:7px; }
body .el-checkbox__input.is-checked .el-checkbox__inner, body .el-checkbox__input.is-indeterminate .el-checkbox__inner, body .el-radio__input.is-checked .el-radio__inner { background:#5264e7; border-color:#5264e7; }
body .el-checkbox__input.is-checked+.el-checkbox__label, body .el-radio__input.is-checked+.el-radio__label, body .el-select-dropdown__item.selected, body .el-tabs__item.is-active, body .el-tabs__item:hover { color:#5264e7; }
body .el-tabs__active-bar { background:#5264e7; height:3px; border-radius:3px; }
body .el-tabs__nav-wrap:after { background:#edf0f5; }
body .el-tag { border-radius:6px; background:#eef0ff; border-color:#dfe4ff; color:#5264e7; }
body .el-tag--success { background:#ecfbf3; border-color:#caefdc; color:#18885f; }
body .el-tag--warning { background:#fff8e9; border-color:#f5e5be; color:#a77521; }
body .el-tag--danger { background:#fff0f2; border-color:#f7d5db; color:#c84f62; }
body .el-tag--info { background:#f0f3f8; border-color:#e0e5ee; color:#6b7890; }
body .el-card { border:1px solid var(--erp-line); border-radius:16px; box-shadow:0 5px 22px #1e28460a; }
body .el-card__header { border-color:#edf0f5; color:#25314a; }
body .el-dialog, body .el-message-box { border-radius:16px; box-shadow:0 24px 80px #191f3a30; overflow:hidden; }
body .el-dialog__header { padding:22px 24px; background:linear-gradient(115deg,#f0f2ff,#fafbff); border-bottom:1px solid #e2e6f5; }
body .el-dialog__title { color:#263454; font-size:18px; font-weight:700; }
body .el-dialog__headerbtn { top:24px; right:24px; }
body .el-dialog__body { padding:24px; }
body .el-dialog { display:flex; flex-direction:column; max-height:90vh; margin-top:5vh !important; }
body .el-dialog__header, body .el-dialog__footer { flex-shrink:0; }
body .el-dialog__body { min-height:0; overflow:auto; }
body .el-dialog .app-container { padding:0 !important; margin:0 !important; border:0 !important; box-shadow:none !important; }
body .el-dialog .el-form > .el-row:has(> .el-col):not(:has(> .el-table)) { display:flex; flex-wrap:wrap; }
body .el-dialog .el-form > .el-row > :is(.el-col-5,.el-col-6,.el-col-7,.el-col-8) { width:25%; min-width:240px; max-width:100%; padding-right:16px; }
body .el-dialog .el-form > .el-row > :is(.el-col-5,.el-col-6,.el-col-7,.el-col-8) > .el-form-item > .el-form-item__label { width:auto !important; float:none; display:block; text-align:left; }
body .el-dialog .el-form > .el-row > :is(.el-col-5,.el-col-6,.el-col-7,.el-col-8) > .el-form-item > .el-form-item__content { margin-left:0 !important; }
body .el-dialog .el-form-item__content > :is(.el-select,.el-input,.el-date-editor) { max-width:100%; }
body .el-dialog .el-form > .el-row > :is(.el-col-5,.el-col-6,.el-col-7,.el-col-8) .el-form-item__content > :is(.el-select,.el-input,.el-date-editor) { width:100% !important; }
body .el-dialog__footer { padding:16px 24px; border-top:1px solid #e9ecf4; background:#fcfcff; }
body .el-dialog__body > .dialog-footer { position:sticky; bottom:-24px; z-index:3; margin:16px -24px -24px; padding:16px 24px; background:#fcfcff; border-top:1px solid #e9ecf4; }
body .el-drawer__header { color:#263454; font-weight:700; }
body .el-select-dropdown, body .el-dropdown-menu, body .el-picker-panel { border-color:var(--erp-line); border-radius:12px; box-shadow:0 8px 30px #191f3a14; }
body .el-dropdown-menu__item:hover { color:#5264e7; background:#eef0ff; }
body .el-loading-spinner .path { stroke:#5264e7; }
body .el-loading-spinner .el-loading-text { color:#5264e7; }
body .login { background:radial-gradient(ellipse at 15% 25%,#6575ef55,transparent 50%),radial-gradient(ellipse at 80% 80%,#22b6b333,transparent 48%),#191f3a !important; }
body .login-form { border:1px solid #ffffff66; border-radius:20px; box-shadow:0 30px 90px #090f2c55; padding:34px; }
body .login-form .title { color:#263454; font-weight:700; }
body .login-form .el-input__inner { border-radius:9px; }
body #local-migration-notice { top:auto !important; bottom:90px !important; z-index:1001 !important; width:auto !important; max-width:min(540px,calc(100vw - 32px)) !important; white-space:normal; border-radius:12px !important; box-shadow:0 6px 24px #191f3a14 !important; border-color:#efddb1 !important; font-size:12px !important; }
body .floating-container { filter:hue-rotate(22deg); }
body .erp-local-footer { border:1px solid #e1e5f0 !important; border-radius:7px !important; color:#758099 !important; background:#ffffffed !important; font:11px/1.5 Arial,"Microsoft YaHei",sans-serif !important; padding:4px 8px !important; }
body .erp-local-footer a { color:#5264e7 !important; }

/* Home overview: real totals, with individual colors for inventory stages. */
body #app .home { max-width:1800px; margin:0 auto; }
.erp-overview { margin-bottom:24px; }
.erp-overview-heading { display:flex; align-items:center; justify-content:space-between; gap:20px; margin:2px 0 22px; }
.erp-eyebrow { display:block; font-size:11px; color:#7d88a4; letter-spacing:2px; font-weight:700; margin-bottom:9px; }
.erp-overview h1 { font-size:27px; line-height:1.3; letter-spacing:.4px; color:#1d2943; margin:0 0 9px; }
.erp-overview p { color:#7b869b; font-size:13px; margin:0; }
.erp-shortcuts { display:flex; gap:10px; flex-wrap:wrap; }
.erp-shortcuts a { display:inline-flex; align-items:center; padding:11px 16px; background:white; border:1px solid #dfe3ef; border-radius:10px; color:#526079; font-size:13px; font-weight:600; }
.erp-shortcuts a:first-child { background:#5264e7; border-color:#5264e7; color:#fff; box-shadow:0 4px 12px #5264e721; }
.erp-shortcuts a:hover { transform:translateY(-1px); border-color:#5264e7; }
.erp-metrics { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; }
.erp-metric { background:white; border:1px solid #e4e7ef; border-radius:16px; padding:20px; box-shadow:0 5px 22px #1e284608; position:relative; overflow:hidden; }
.erp-metric::after { content:""; position:absolute; top:0; left:20px; right:20px; height:3px; background:var(--metric-color); border-radius:0 0 5px 5px; opacity:.65; }
.erp-metric-top { display:flex; align-items:center; gap:10px; margin-bottom:14px; color:#6c7891; font-size:13px; }
.erp-metric-icon { display:grid; place-items:center; width:36px; height:36px; flex-shrink:0; border-radius:11px; color:var(--metric-color); background:var(--metric-bg); }
.erp-metric-icon svg { width:19px; height:19px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.erp-metric strong { display:block; color:#202d48; font-size:30px; font-weight:700; letter-spacing:-.7px; font-variant-numeric:tabular-nums; }
.erp-metric small { display:block; margin-top:8px; font-size:12px; color:#8791a6; }
body #app .home > .el-row { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:20px; margin:0 !important; }
body #app .home > .el-row::before, body #app .home > .el-row::after { display:none; }
body #app .home > .el-row > .el-col { width:auto; padding:0 !important; min-width:0; }
body #app .home > .el-row > .el-col:nth-child(2) { grid-column:1 / -1; order:3; }
body #app .home .update-log { margin-bottom:0; }
body #app .home .el-card__header { padding:18px 20px; background:linear-gradient(100deg,#f3f2ff,#fff); border-left:4px solid #8271e7; }
body #app .home .el-col:nth-child(2) .el-card__header { background:linear-gradient(100deg,#eef9f7,#fff); border-left-color:#2bab91; }
body #app .home .el-col:nth-child(3) .el-card__header { background:linear-gradient(100deg,#fff8eb,#fff); border-left-color:#dea044; }
body #app .home .el-card__header .text-center { text-align:left; }
body #app .home .el-card__header span { font-size:15px !important; }
body #app .home .el-card__body { padding:14px 18px 18px; }
body #app .home .el-table__body-wrapper { max-height:360px !important; }
body #app .home .el-table td { padding:8px 0; }
body #app .home .el-table th { padding:10px 0; }
body.erp-utility { background:#f6f7fb; color:#172033; font-family:Arial,"Microsoft YaHei",sans-serif; }
body.erp-utility h1 { color:#263454; font-size:28px; }
body.erp-utility a { color:#5264e7; text-decoration:none; }
body.erp-utility section, body.erp-utility .card, body.erp-utility > main:only-of-type:not(:has(header)) { border:1px solid #e4e7ef; border-radius:16px; box-shadow:0 5px 22px #1e28460a; }
body.erp-utility .card { border-top:3px solid #8271e7; }
body.erp-utility .card:nth-child(2) { border-top-color:#2bab91; }
body.erp-utility .card:nth-child(3) { border-top-color:#dea044; }
body.erp-utility th { background:#f5f6fc; color:#526079; }
body.erp-utility button { background:#5264e7; border:0; border-radius:9px; color:white; font-weight:600; padding:10px 18px; }
body.erp-utility progress { accent-color:#5264e7; }
@media (max-width:1100px) { .erp-metrics { grid-template-columns:repeat(2,minmax(0,1fr)); } .erp-overview-heading { align-items:flex-start; } .erp-shortcuts { max-width:230px; justify-content:flex-end; } }
@media (max-width:767px) {
 body #app .app-container { padding:16px; }
 body #app .app-container:not(.home) { margin:12px; padding:16px; }
 .erp-overview-heading { flex-direction:column; gap:16px; } .erp-shortcuts { max-width:none; justify-content:flex-start; }
 .erp-overview h1 { font-size:24px; } .erp-metrics { gap:10px; } .erp-metric { padding:15px; } .erp-metric strong { font-size:25px; } .erp-metric-top { gap:7px; font-size:12px; }
 body #app .home > .el-row { grid-template-columns:minmax(0,1fr); gap:16px; }
 body .el-dialog { max-width:calc(100vw - 20px) !important; width:calc(100vw - 20px) !important; }
 body .el-dialog__body { padding:16px; } body .el-dialog__footer { padding:14px 16px; }
 body .el-dialog__body > .dialog-footer { bottom:-16px; margin:16px -16px -16px; padding:14px 16px; }
 body .el-dialog .el-form > .el-row > .el-col { width:100%; min-width:0; padding-right:0; }
 body #local-migration-notice { max-width:calc(100vw - 24px) !important; right:12px !important; }
 body.erp-utility main { padding:0 16px; } body.erp-utility section { overflow:auto; }
}
@media (prefers-reduced-motion:reduce) { body *, body *::before, body *::after { scroll-behavior:auto !important; transition:none !important; animation:none !important; } }
