:root{--sidebar:#263b45;--sidebar-muted:#adc0c7;--teal:#168c8c;--teal-dark:#117373;--surface:#fff;--canvas:#f4f7f8;--border:#dfe7e9}*{box-sizing:border-box}body{background:var(--canvas);color:#25343b;font-size:.925rem}.admin-shell{min-height:100vh}.sidebar{position:fixed;inset:0 auto 0 0;width:255px;background:var(--sidebar);z-index:1040;display:flex;flex-direction:column;overflow-y:auto;transition:transform .22s}.brand{height:68px;display:flex;align-items:center;gap:.75rem;padding:0 1.25rem;color:#fff;text-decoration:none;font-size:1.1rem;font-weight:700;border-bottom:1px solid rgba(255,255,255,.08)}.brand-mark{display:inline-grid;place-items:center;width:35px;height:35px;border-radius:10px;background:var(--teal);color:#fff}.sidebar-nav{padding:.8rem}.sidebar-nav .nav-link{display:flex;align-items:center;gap:.8rem;color:var(--sidebar-muted);padding:.68rem .8rem;border-radius:.5rem;margin-bottom:.15rem}.sidebar-nav .nav-link i{font-size:1.05rem;width:20px}.sidebar-nav .nav-icon{display:inline-flex;align-items:center;justify-content:center;width:20px;height:1.05rem;flex:0 0 20px}.sidebar-nav .nav-icon-spool svg{display:block;width:1.15em;height:1.15em}.sidebar-nav .nav-link:hover,.sidebar-nav .nav-link.active{color:#fff;background:rgba(22,140,140,.28)}.main-area{margin-left:255px;min-height:100vh}.topbar{height:68px;padding:0 1.5rem;background:#fff;border-bottom:1px solid var(--border);display:flex;align-items:center;position:sticky;top:0;z-index:1020}
.profile-menu-toggle{display:inline-flex;align-items:center;gap:.7rem;padding:.35rem .65rem .35rem .35rem;border:1px solid var(--border);border-radius:999px;background:#fff;box-shadow:none}
.profile-menu-toggle:hover,.profile-menu-toggle:focus,.profile-menu-toggle.show{background:#f4f8f8;border-color:#c9d7db;box-shadow:none}
.profile-menu-toggle::after{margin-left:.15rem}
.profile-avatar{width:36px;height:36px;border-radius:50%;display:inline-grid;place-items:center;background:var(--teal);color:#fff;font-weight:700;font-size:.95rem;flex:0 0 auto}
.profile-avatar-lg{width:56px;height:56px;font-size:1.35rem}
.profile-menu-meta{flex-direction:column;align-items:flex-start;line-height:1.15;text-align:left;min-width:0}
.profile-menu-name{font-weight:600;font-size:.9rem;color:#25343b;max-width:160px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.profile-menu-role{font-size:.72rem;color:#6b7c84}
.profile-dropdown{min-width:240px;border:1px solid var(--border);box-shadow:0 12px 30px rgba(35,58,67,.12);padding:.35rem 0}
.profile-dropdown .dropdown-item{padding:.55rem 1rem}
.profile-dropdown .dropdown-item i{width:1.1rem}
.content-area{padding:1.5rem}.card{border:1px solid var(--border);box-shadow:0 2px 10px rgba(35,58,67,.035)}.card-header{background:#fff;border-bottom-color:var(--border);font-weight:600}.btn-primary{--bs-btn-bg:var(--teal);--bs-btn-border-color:var(--teal);--bs-btn-hover-bg:var(--teal-dark);--bs-btn-hover-border-color:var(--teal-dark)}.text-primary{color:var(--teal)!important}.page-item.active .page-link{background:var(--teal);border-color:var(--teal)}.stat-card .stat-icon{width:44px;height:44px;border-radius:12px;display:grid;place-items:center;font-size:1.25rem;background:#e6f5f4;color:var(--teal)}.table>:not(caption)>*>*{padding:.75rem;vertical-align:middle}.table thead th{white-space:nowrap;color:#66777e;font-size:.78rem;text-transform:uppercase;letter-spacing:.035em;background:#f8fafb}.page-title{font-size:1.45rem;font-weight:700;margin:0}.empty-state{text-align:center;padding:3rem 1rem;color:#7b8b91}.empty-state i{font-size:2.5rem;display:block;margin-bottom:.7rem}.form-label{font-weight:600;font-size:.86rem}.required:after{content:" *";color:#dc3545}.sidebar-backdrop{display:none}.guest-page{min-height:100vh;background:linear-gradient(135deg,#edf7f6,#f5f7f8);display:grid;place-items:center}.guest-card{max-width:440px;background:#fff;border:1px solid var(--border);border-radius:1rem;padding:2rem;box-shadow:0 18px 55px rgba(35,58,67,.11)}.guest-logo{width:52px;height:52px;font-size:1.45rem}.chart-box{position:relative;height:280px}.color-dot{width:16px;height:16px;border-radius:50%;display:inline-block;border:1px solid #ccd}.action-cell{white-space:nowrap}.stock-item-card{background:#fff;border:1px solid var(--border);border-radius:1rem;overflow:hidden;box-shadow:0 4px 18px rgba(35,58,67,.05);display:flex;flex-direction:column;transition:transform .18s ease,box-shadow .18s ease}
.stock-item-card:hover{transform:translateY(-3px);box-shadow:0 12px 28px rgba(35,58,67,.1)}
.stock-item-card.is-inactive{opacity:.78}
.stock-item-card.is-low{border-color:#f0c36d}
.stock-item-head{display:flex;align-items:flex-start;gap:.85rem;padding:1rem 1.1rem .25rem;position:relative}
.stock-item-icon{width:46px;height:46px;border-radius:12px;display:grid;place-items:center;background:#e7f5f4;color:var(--teal);font-size:1.25rem;flex:0 0 auto}
.stock-item-code{font-size:.75rem;color:#6b7c84;font-weight:600}
.stock-item-title{font-size:1rem;font-weight:700;margin:0;line-height:1.3}
.stock-item-badge{position:absolute;top:.85rem;right:.85rem;font-size:.72rem;font-weight:700;padding:.25rem .5rem;border-radius:.5rem}
.stock-item-badge.warn{background:#fff4d6;color:#8a5a00}
.stock-item-badge.inactive{background:#e8eef0;color:#5b6b72}
.stock-item-body{padding:.75rem 1.1rem 1.1rem;display:flex;flex-direction:column;gap:.75rem;flex:1}
.stock-item-qty{background:#f7fafb;border:1px solid var(--border);border-radius:.75rem;padding:.75rem .85rem}
.stock-item-qty-value{font-size:1.25rem;font-weight:700;color:#25343b}
.stock-item-desc{margin:0;color:#6b7c84;font-size:.85rem;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.stock-item-actions{display:flex;gap:.4rem;margin-top:auto}
.filter-card{margin-bottom:1rem}
.filament-card{background:#fff;border:1px solid var(--border);border-radius:1rem;overflow:hidden;box-shadow:0 4px 18px rgba(35,58,67,.05);display:flex;flex-direction:column;transition:transform .18s ease,box-shadow .18s ease}
.filament-card:hover{transform:translateY(-3px);box-shadow:0 12px 28px rgba(35,58,67,.1)}
.filament-card.is-inactive{opacity:.78}
.filament-card.is-low{border-color:#f0c36d}
.filament-card-swatch{position:relative;min-height:120px;background:var(--swatch);color:var(--swatch-fg)}
.filament-card-swatch-inner{display:flex;align-items:center;gap:1rem;padding:1.1rem 1.15rem}
.filament-spool{width:58px;height:58px;border-radius:50%;background:
  radial-gradient(circle at center,#fff 0 12px,rgba 13px 14px,var(--swatch) 15px);
  box-shadow:inset 0 0 0 3px rgba(255,255,255,.35),0 8px 18px rgba(0,0,0,.18);flex:0 0 auto;border:2px solid rgba(255,255,255,.45)}
.filament-swatch-meta{display:flex;flex-direction:column;gap:.35rem;min-width:0}
.filament-color-name{font-size:1.05rem;font-weight:700;line-height:1.2;text-shadow:0 1px 2px rgba(0,0,0,.12)}
.filament-material-chip{display:inline-flex;align-self:flex-start;padding:.2rem .55rem;border-radius:999px;background:rgba(255,255,255,.22);font-size:.75rem;font-weight:700;letter-spacing:.04em}
.filament-badge-warn,.filament-badge-inactive{position:absolute;top:.75rem;right:.75rem;font-size:.72rem;font-weight:700;padding:.25rem .5rem;border-radius:.5rem}
.filament-badge-warn{background:#fff4d6;color:#8a5a00}
.filament-badge-inactive{background:rgba(31,41,51,.75);color:#fff}
.filament-card-body{padding:1rem 1.1rem 1.1rem;display:flex;flex-direction:column;gap:.85rem;flex:1}
.filament-code{font-size:.75rem;color:#6b7c84;font-weight:600;letter-spacing:.03em}
.filament-title{font-size:1rem;font-weight:700;margin:0;line-height:1.3}
.filament-diameter{flex:0 0 auto;background:#eef4f5;color:#456069;border-radius:.55rem;padding:.25rem .5rem;font-size:.78rem;font-weight:700}
.filament-progress{height:.55rem;background:#e8eef0}
.filament-desc{margin:0;color:#6b7c84;font-size:.85rem;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.filament-actions{display:flex;gap:.4rem;margin-top:auto;padding-top:.25rem}
@media(max-width:991.98px){.sidebar{transform:translateX(-100%)}.sidebar.show{transform:none}.main-area{margin-left:0}.sidebar-backdrop.show{display:block;position:fixed;inset:0;background:rgba(0,0,0,.35);z-index:1030}.content-area{padding:1rem}}@media(max-width:575.98px){.guest-card{padding:1.35rem}.table-responsive{font-size:.85rem}}

