:root{--bg:#f7f8fc;--surface:#fff;--ink:#202235;--muted:#9295a8;--line:#e8e9f1;--purple:#6e63e8;--purple-soft:#efedff;--orange:#eba044;--teal:#27ad9f;--red:#e86d75;--shadow:0 8px 24px rgba(26,31,62,.035)}*{box-sizing:border-box}body{background:var(--bg);color:var(--ink);font-family:'DM Sans',sans-serif;font-size:18px;margin:0}.list-page{min-height:100vh}.list-topbar{align-items:center;background:#fff;border-bottom:1px solid var(--line);display:flex;height:74px;justify-content:space-between;padding:0 6.2%}.back-link{color:#777b90;font-size:16px;font-weight:600;text-decoration:none}.back-link:first-letter{color:var(--purple);font-size:23px}.top-actions{align-items:center;display:flex;gap:25px}.topbar-divider{background:var(--line);height:26px;width:1px}.date-label{text-align:right}.date-label span{color:#a7a9b7;display:block;font-size:14px;margin-bottom:3px}.date-label strong{font-size:16px}.icon-button{background:none;border:0;color:#74788c;font-size:25px;position:relative}.icon-button i{background:#ee7078;border:2px solid #fff;border-radius:50%;height:7px;position:absolute;right:0;top:0;width:7px}.profile{align-items:center;border-left:1px solid var(--line);display:flex;gap:9px;padding-left:22px}.avatar{background:#6fa7dc;border-radius:50%;color:#fff;font-size:14px;font-weight:700;height:29px;line-height:29px;text-align:center;width:29px}.profile strong,.profile small{display:block}.profile strong{font-size:15px}.profile small{color:#a3a5b4;font-size:13px;margin-top:3px}.list-content{margin:0 auto;max-width:1320px;padding:36px 28px 24px}.page-intro{align-items:flex-end;display:flex;justify-content:space-between;margin-bottom:27px}.eyebrow{color:#9a9cac;font-size:14px;font-weight:700;letter-spacing:1.3px;margin:0 0 8px}.page-intro h1{font-family:'Plus Jakarta Sans';font-size:30px;letter-spacing:-.8px;margin:0}.subtitle{color:var(--muted);font-size:16px;margin:8px 0 0}.primary-button{background:var(--purple);border-radius:7px;box-shadow:0 5px 12px #7065e833;color:#fff;font-size:15px;font-weight:700;padding:12px 14px;text-decoration:none}.stats-grid{display:grid;gap:15px;grid-template-columns:repeat(4,1fr);margin-bottom:19px}.stat-card{align-items:center;background:#fff;border:1px solid #eeeff4;border-radius:11px;box-shadow:var(--shadow);display:flex;gap:13px;padding:16px}.stat-icon{border-radius:8px;font-size:20px;height:34px;line-height:34px;text-align:center;width:34px}.stat-icon.purple{background:var(--purple-soft);color:var(--purple)}.stat-icon.orange{background:#fff3df;color:var(--orange)}.stat-icon.teal{background:#e5f8f5;color:var(--teal)}.stat-icon.red{background:#ffebed;color:var(--red);font-size:14px;font-weight:700}.stat-card small,.stat-card em{color:#9295a8;display:block;font-size:14px;font-style:normal}.stat-card strong{display:inline-block;font-family:'Plus Jakarta Sans';font-size:22px;margin:5px 6px 3px 0}.stat-card em{display:inline}.table-card{background:#fff;border:1px solid #eeeff4;border-radius:12px;box-shadow:var(--shadow);padding:22px}.table-heading{align-items:flex-start;display:flex;justify-content:space-between}.table-heading h2{font-family:'Plus Jakarta Sans';font-size:18px;margin:0}.table-heading p{color:#a1a4b4;font-size:15px;margin:6px 0 0}.table-actions{align-items:center;display:flex;gap:10px}.search-box{align-items:center;border:1px solid var(--line);border-radius:6px;color:#999cad;display:flex;font-size:23px;gap:5px;padding:4px 9px}.search-box input{border:0;color:#5e6276;font:17px 'DM Sans';outline:0;width:145px}.search-box input::placeholder{font-size:17px}.table-actions select{background:#fff;border:1px solid var(--line);border-radius:6px;color:#777b90;font:17px 'DM Sans';padding:9px}.filter-tabs{border-bottom:1px solid var(--line);display:flex;gap:21px;margin-top:25px}.filter-tab{background:none;border:0;border-bottom:2px solid transparent;color:#999cad;cursor:pointer;font:600 15px 'DM Sans';padding:0 0 12px}.filter-tab.active{border-color:var(--purple);color:var(--purple)}.filter-tab b{background:#f0efff;border-radius:10px;color:var(--purple);font-size:13px;margin-left:5px;padding:3px 6px}.filter-tab:not(.active) b{background:#f2f2f6;color:#999cad}.table-scroll{overflow-x:auto}.table-card table{border-collapse:collapse;min-width:780px;width:100%}.table-card th{border-bottom:1px solid var(--line);color:#adafbd;font-size:13px;padding:17px 10px 11px;text-align:left;white-space:nowrap}.table-card td{border-bottom:1px solid #f1f1f5;color:#85899a;font-size:14px;padding:14px 10px;white-space:nowrap}.table-card th:first-child,.table-card td:first-child{padding-left:0}.table-card th:last-child,.table-card td:last-child{padding-right:0}.quotation-id{color:#6259d2;font-size:14px;font-weight:700}.customer{align-items:center;display:flex;gap:8px}.customer-avatar{border-radius:50%;font-size:13px;font-weight:700;height:22px;line-height:22px;text-align:center;width:22px}.customer-avatar.purple{background:#eeebff;color:#6e63df}.customer-avatar.orange{background:#fff0d9;color:#df9142}.customer-avatar.teal{background:#e3f7f3;color:#28a798}.customer span:last-child{color:#555a70;font-weight:600}.status{border-radius:12px;font-size:13px;font-weight:600;padding:5px 8px}.status.draft{background:#f0efff;color:#6f65d9}.status.review{background:#fff3df;color:#db9343}.status.approved{background:#e5f8f4;color:#2aa48f}.row-menu{background:none;border:0;color:#a5a7b5;cursor:pointer;font-size:21px}.empty-state{color:#a6a8b6;display:none;font-size:15px;padding:34px;text-align:center}.table-footer{align-items:center;color:#a5a7b5;display:flex;font-size:14px;justify-content:space-between;padding-top:17px}.table-footer strong{color:#62667a}.pagination{display:flex;gap:5px}.pagination button{background:#fff;border:1px solid var(--line);border-radius:5px;color:#85899a;cursor:pointer;font-size:15px;height:26px;width:26px}.pagination button:disabled{color:#d0d1d8}.pagination .current{background:var(--purple);border-color:var(--purple);color:#fff}footer{color:#a7a9b6;font-size:14px;padding:18px 2px 0}footer span{padding:0 5px}@media(max-width:900px){.stats-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:600px){.list-topbar{padding:0 17px}.profile{display:none}.list-content{padding:25px 16px 18px}.page-intro{align-items:flex-start;flex-direction:column;gap:18px}.page-intro h1{font-size:26px}.primary-button{align-self:stretch;text-align:center}.table-card{padding:16px}.table-heading{flex-direction:column;gap:14px}.table-actions{width:100%}.search-box{flex:1}.search-box input{width:100%}.table-actions select{width:95px}.filter-tabs{gap:17px;overflow:auto}.filter-tab{flex-shrink:0}.stats-grid{gap:10px}.stat-card{align-items:flex-start;display:block;padding:13px}.stat-icon{display:block;margin-bottom:11px}.stat-card strong{font-size:22px}.stat-card em{display:block;margin-top:2px}}

.sr-only{clip:rect(0 0 0 0);clip-path:inset(50%);height:1px;overflow:hidden;position:absolute;white-space:nowrap;width:1px}
.skip-link{background:var(--ink);border-radius:0 0 6px 0;color:#fff;font-weight:700;left:0;padding:10px 14px;position:fixed;top:0;transform:translateY(-120%);transition:transform .15s;z-index:100}
.skip-link:focus{transform:translateY(0)}
[hidden]{display:none!important}
.empty-state:not([hidden]){display:block}
.primary-button{border:1px solid var(--purple);cursor:pointer;font-family:inherit}
.production-progress{align-items:center;display:flex;gap:8px;min-width:105px}
.production-progress i{background:#f0f1f5;border-radius:3px;display:block;height:4px;overflow:hidden;width:62px}
.production-progress i b{background:var(--purple);border-radius:3px;display:block;height:100%}
.row-menu{border:1px solid #e7e6f5;border-radius:5px;color:#6259d2;display:inline-block;font-size:14px;font-weight:700;padding:6px 8px;text-decoration:none}.row-menu-wrapper{position:relative;display:inline-block}.row-dropdown{position:absolute;right:0;top:100%;background:#fff;border:1px solid #e8e9f1;border-radius:8px;box-shadow:0 8px 24px rgba(26,31,62,.1);min-width:140px;z-index:20;padding:4px 0}.row-dropdown a,.row-dropdown button{display:block;width:100%;text-align:left;padding:8px 14px;font-size:14px;color:#555a70;background:none;border:0;cursor:pointer;text-decoration:none}.row-dropdown a:hover,.row-dropdown button:hover{background:#f6f5ff;color:#6e63e8}
:where(a,button,input,select,textarea):focus-visible{outline:3px solid #3026a8;outline-offset:3px}
.search-box:focus-within{border-color:#7770df;box-shadow:0 0 0 3px var(--purple-soft)}
.search-box input:focus-visible{outline:0}
@media(prefers-reduced-motion:reduce){.skip-link{transition:none}}

/* Shared ERP surface system */
:root{--surface-raised:#fff;--surface-subtle:#fbfbfe;--ink-strong:#171a2b;--focus-ring:#b9b4ff}
html{scroll-behavior:smooth}
body{line-height:1.45;-webkit-font-smoothing:antialiased}
.list-topbar{background:rgba(255,255,255,.86);backdrop-filter:blur(14px);height:72px;position:sticky;top:0;z-index:20}
.back-link{align-items:center;display:inline-flex;gap:7px;transition:color .18s ease,transform .18s ease}
.back-link:hover{color:var(--purple);transform:translateX(-2px)}
.top-actions{gap:18px}
.icon-button{cursor:pointer;transition:color .18s ease,transform .18s ease}
.icon-button:hover{color:var(--purple);transform:translateY(-1px)}
.profile{padding-left:18px}
.list-content{padding-top:40px}
.page-intro{margin-bottom:30px}
.page-intro h1{color:var(--ink-strong);line-height:1.2}
.primary-button{align-items:center;border-radius:9px;display:inline-flex;gap:7px;justify-content:center;min-height:40px;transition:background .18s ease,box-shadow .18s ease,transform .18s ease}
.primary-button:hover{background:#5c52d7;box-shadow:0 10px 22px rgba(110,99,232,.22);transform:translateY(-1px)}
.primary-button:active{transform:translateY(0)}
.stats-grid{gap:16px}
.stat-card,.table-card{border-radius:14px;box-shadow:0 8px 24px rgba(26,31,62,.045);transition:box-shadow .2s ease,transform .2s ease}
.stat-card:hover,.table-card:hover{box-shadow:0 14px 34px rgba(26,31,62,.075);transform:translateY(-1px)}
.stat-card{min-height:92px;padding:18px}
.table-card{padding:24px}
.table-heading h2{color:var(--ink-strong)}
.table-card th{letter-spacing:.04em}
.table-card tbody tr{transition:background .16s ease}
.table-card tbody tr:hover{background:#fcfcff}
.table-card td{height:54px}
.search-box,.table-actions select{background:var(--surface-subtle);border-radius:8px;min-height:36px}
.filter-tabs{gap:24px;margin-top:27px}
.filter-tab{padding-bottom:13px}
.table-footer{border-top:1px solid transparent}
:where(a,button,input,select,textarea):focus-visible{outline:3px solid var(--focus-ring);outline-offset:2px}
@media(max-width:900px){.list-content{padding-top:30px}.table-card{padding:20px}}
@media(max-width:600px){.list-topbar{height:64px}.list-content{padding-top:25px}.table-card{border-radius:12px;padding:16px}.stat-card{border-radius:12px;min-height:0}.primary-button{min-height:42px}.table-card td{height:50px}}
