:root{--h-green: 159, 100%, 34%;--h-red: 353, 96%, 43%;--h-orange: 43, 100%, 38%;--h-blue: 201, 100%, 36%;--h-magenta: 324, 100%, 40%;--h-cyan: 188, 100%, 33%;--h-purple: 288, 65%, 41%;--h-yellow: 48, 100%, 32%;--h-emerald: 125, 46%, 34%;--h-grey: 0, 0%, 40%;--h-neutral: 240, 5%, 10%}:root{--status-green: hsl(var(--h-green));--status-green-bg: hsla(var(--h-green), .1);--status-orange: hsl(var(--h-orange));--status-orange-bg: hsla(var(--h-orange), .1);--status-red: hsl(var(--h-red));--status-red-bg: hsla(var(--h-red), .1);--status-blue: hsl(var(--h-blue));--status-blue-bg: hsla(var(--h-blue), .1);--status-grey: hsl(var(--h-grey));--status-grey-bg: hsla(var(--h-grey), .1);--status-magenta: hsl(var(--h-magenta));--status-magenta-bg: hsla(var(--h-magenta), .1);--status-cyan: hsl(var(--h-cyan));--status-cyan-bg: hsla(var(--h-cyan), .1);--status-purple: hsl(var(--h-purple));--status-purple-bg: hsla(var(--h-purple), .1);--status-yellow: hsl(var(--h-yellow));--status-yellow-bg: hsla(var(--h-yellow), .1);--status-emerald: hsl(var(--h-emerald));--status-emerald-bg: hsla(var(--h-emerald), .1);--clr-background: hsl(0, 0%, 100%);--clr-darkwhite-background: hsl(0, 0%, 96%);--clr-darkgrey-background: hsl(0, 0%, 91.5%);--clr-lightgrey-background: hsl(0, 0%, 100%);--clr-darkgrey-bg: hsl(0, 0%, 12%);--clr-font-black: hsl(0, 0%, 0%);--clr-font-white: hsl(0, 0%, 93%);--clr-font-grey: hsl(0, 0%, 30%);--clr-font-lightgrey: hsl(0, 0%, 70%);--clr-verylightgrey: hsl(0, 0%, 83%);--clr-edit-mode: rgb(213,213,213);--clr-tbl-2nd-row-bg: hsla(0, 0%, 89%, .1);--clr-shadow-border: hsla(0, 0%, 0%, .1);--clr-category-node-lines: hsl(0, 0%, 83%);--clr-data-sheet-bar-hover: hsla(0, 0%, 0%, .05);--clr-magenta: hsl(324, 100%, 44%);--clr-eti-magenta: hsl(var(--h-magenta));--clr-eti-magenta-fixed: hsl(var(--h-magenta));--clr-eti-magenta-hover: hsl(var(--h-magenta), .9);--clr-status-active-font: hsl(var(--h-green));--clr-status-active-border: hsla(var(--h-green), .4);--clr-status-active-dot: hsl(159, 100%, 34%);--clr-status-active-glow: hsla(152, 100%, 50%, .3);--clr-website-display-active-bg: hsla(var(--h-magenta), .1);--clr-lang-chip-hover-glow: hsla(var(--h-magenta), .3);--clr-tooltip-bg: var(--clr-darkgrey-background);--clr-tooltip-font: var(--clr-font-black);--clr-tooltip-shadow: hsla(0, 0%, 0%, .2);--clr-status-infor-font: hsl(var(--h-green));--clr-status-infor-bg: hsla(152, 100%, 50%, .15);--clr-status-active-font: hsl(var(--h-orange));--clr-status-active-bg: hsla(43, 100%, 50%, .15);--clr-status-obsolete-font: hsl(0, 0%, 47%);--clr-status-obsolete-bg: hsla(0, 0%, 47%, .15);--clr-status-order-font: hsl(var(--h-blue));--clr-status-order-bg: hsla(190, 100%, 42%, .15);--clr-status-withdrawn-font: hsl(var(--h-red));--clr-status-withdrawn-bg: hsla(353, 100%, 54%, .15);--clr-input-focus-bg: hsla(310.4, 100%, 95.5%, .38);--clr-filter-hover: hsl(0, 0%, 16%);--clr-notification-popup-glow: hsla(0, 0%, 0%, .1);--clr-btn-clear-all-font: hsl(0, 100%, 63%);--clr-btn-clear-all-bg: hsla(0, 100%, 81%, .5);--clr-btn-clear-all-shadow: hsl(0, 100%, 78%);--clr-btn-select-all-bg: hsla(159, 100%, 30%, .39);--clr-thumbnail-bg: hsl(0, 0%, 96%)}[data-theme=dark]{--clr-background: hsl(232, 12%, 15%);--clr-darkwhite-background: hsl(232, 12%, 15%);--clr-darkgrey-background: hsl(232, 12%, 12%);--clr-lightgrey-background: hsl(232, 12%, 19%);--clr-font-black: hsl(0, 0%, 100%);--clr-font-white: hsl(0, 0%, 93%);--clr-font-grey: hsl(0, 0%, 93%);--clr-font-lightgrey: hsl(0, 0%, 70%);--clr-shadow-border: hsl(240, 8%, 31%);--clr-category-node-lines: hsl(0, 0%, 43%);--clr-data-sheet-bar-hover: hsla(0, 0%, 100%, .05);--clr-edit-mode: rgb(73,73,85);--clr-status-active-glow: hsla(var(--h-green), .6);--clr-lang-chip-hover-glow: var(--clr-website-display-active-bg);--clr-tbl-2nd-row-bg: hsl(240, 8%, 31%);--clr-website-display-active-bg: hsla(324.1, 100%, 77.1%, .31);--clr-tooltip-bg: hsl(232, 12%, 12%);--clr-tooltip-font: hsl(0, 0%, 93%);--clr-tooltip-shadow: hsla(0, 0%, 0%, .5);--clr-status-infor-bg: hsla(var(--h-green), .1);--clr-status-active-bg: hsla(var(--h-orange), .1);--clr-status-obsolete-bg: hsla(var(--h-grey), .1);--clr-status-order-bg: hsla(var(--h-blue), .1);--clr-status-withdrawn-bg: hsla(var(--h-red), .1);--clr-btn-clear-all-bg: hsla(0, 100%, 44%, .4);--clr-btn-clear-all-shadow: hsla(0, 100%, 46%, .83);--clr-btn-select-all-bg: hsla(159, 88%, 31%, .71);--clr-notification-popup-glow: hsla(0, 0%, 25%, .75);--clr-thumbnail-bg: hsl(0, 0%, 58.4%);--clr-input-focus-bg: hsla(324.6, 28.1%, 72.7%, .1)}#eticad-view,#eticad-container{width:100%;height:100%;overflow:hidden;margin:0;padding:0;position:relative}#eticad-container canvas{display:block;width:100%!important;height:100%!important;outline:none}.cad-btn{background-color:#333;color:#fff;border:1px solid #555;padding:6px 12px;cursor:pointer;border-radius:3px;font-family:Roboto,sans-serif}.cad-btn:hover{background-color:#444}.cad-btn.active{background-color:#007bff;border-color:#0056b3}#snap-toggle{background:#444;color:#fff;border:1px solid #666;padding:5px 10px;cursor:pointer;font-family:monospace}#snap-toggle.active{background:#0078d4;border-color:#00bcf2}body{--bg-color: #ffffff;--text-color: #333333;font-family:Roboto,sans-serif;margin:0;background-color:var(--bg-color);color:var(--text-color);transition:background-color .4s cubic-bezier(.4,0,.2,1)}body[data-theme=dark]{--bg-color: #1a1a1a;--text-color: #ffffff}h1{font-size:50px;font-weight:600;margin:0}h2{font-size:24px;margin:0;font-weight:700}p{font-size:.875rem;margin:0}#products-page{display:flex;height:100vh}#left-menu-column{height:100vh;min-width:79px;width:209px;background-color:color-mix(in srgb,var(--clr-darkgrey-background),transparent 20%);box-sizing:border-box;display:flex;flex-direction:column;transition:width .22s ease;overflow:hidden}#left-menu-column.is-collapsed{width:79px}#logo-area{height:75px;width:100%;box-sizing:border-box;display:grid;grid-template-columns:44px 1fr;align-items:center;gap:16px;padding:0 21px}#logo-area svg{justify-self:start}#logo-area svg path{fill:var(--clr-eti-magenta)}#left-menu-column.is-collapsed #logo-area svg:not(.menu-toggle svg){display:none}.menu-toggle{width:40px;height:40px;border:none;background:transparent;border-radius:10px;display:grid;place-items:center;cursor:pointer;color:var(--clr-font-grey);justify-content:center}.menu-toggle:hover{background:var(--clr-shadow-border);color:var(--clr-eti-magenta)}#left-menu-options{display:flex;flex-direction:column;justify-content:space-between;flex:1}.main-menu-button{display:flex;height:50px;width:100%;color:var(--clr-font-grey);font-size:15px;font-weight:400;justify-content:left;align-items:center;box-sizing:border-box;gap:12px;-webkit-user-select:none;user-select:none}.main-menu-button>div{transition:opacity .15s ease,transform .15s ease;white-space:nowrap}.main-menu-button:hover{color:var(--clr-eti-magenta);background-color:var(--clr-shadow-border);cursor:pointer}.main-menu-button svg{padding-left:1.5rem}#left-menu-column.is-collapsed .main-menu-button{justify-content:center;gap:0}#left-menu-column.is-collapsed .main-menu-button svg{padding-left:0}#left-menu-column.is-collapsed .main-menu-button>div{opacity:0;transform:translate(-6px);pointer-events:none;width:0;overflow:hidden}.main-menu-button .icon-hover,.main-menu-button:hover .icon-default,.main-menu-button.is-active .icon-default{display:none}.main-menu-button:hover .icon-hover,.main-menu-button.is-active .icon-hover{display:block}.main-menu-button.is-active{color:var(--clr-eti-magenta);background-color:var(--clr-shadow-border)}#right-window{flex:1;background-color:color-mix(in srgb,var(--clr-darkgrey-background),transparent 20%);display:flex;flex-direction:column;height:100vh;min-width:0;width:100%}.sub-page{flex:1;padding:10px 10px 10px 0;box-sizing:border-box;display:flex;flex-direction:row;overflow:hidden;width:100%}#top-bar{width:100%;height:40px;padding-left:10px;padding-right:10px;box-sizing:border-box;display:flex;flex-direction:row;gap:5px}#location-information{width:100%}.top-bar-button{display:flex;width:35px;justify-content:center;align-items:center;border-radius:8px;transition:all .2s ease;cursor:pointer;margin-top:10px}.top-bar-button svg{fill:var(--clr-font-grey);padding:0;display:block}.top-bar-button:hover svg{fill:var(--clr-eti-magenta)}.top-bar-button .icon-hover,.top-bar-button:hover .icon-default{display:none}.top-bar-button:hover .icon-hover{display:block}.basic-panel{background-color:#fbfbfb;border:1px solid var(--clr-shadow-border);border-radius:7px;box-sizing:border-box;padding:1rem;height:100%;overflow-y:auto;overflow-x:hidden;position:relative}iframe{border-width:0px}