:root{--aside-width: 400px;--cart-aside-summary-height-with-discount: 300px;--cart-aside-summary-height: 250px;--grid-item-width: 355px;--header-height: 64px;--color-dark: #000;--color-light: #fff}aside{box-shadow:0 0 50px #0000004d;height:100vh;width:100%;max-width:var(--aside-width);position:fixed;right:calc(-1 * var(--aside-width));top:0;transition:transform .2s ease-in-out}aside header{align-items:center;border-bottom:1px solid var(--color-gray-200);display:flex;height:var(--header-height);justify-content:space-between;padding:0 20px}aside header h3{margin:0}aside header .close{font-weight:700;opacity:.8;text-decoration:none;transition:all .2s;width:20px}aside header .close:hover{opacity:1}aside header h2{margin-bottom:.6rem;margin-top:0}aside main{margin:1rem}aside p{margin:0 0 .25rem}aside p:last-child{margin:0}aside li{margin-bottom:.125rem}.overlay{background:#0003;bottom:0;left:0;opacity:0;pointer-events:none;position:fixed;right:0;top:0;transition:opacity .4s ease-in-out;transition:opacity .4s;visibility:hidden;z-index:100}.overlay .close-outside{background:transparent;border:none;color:transparent;height:100%;left:0;position:absolute;top:0;width:calc(100% - var(--aside-width))}.overlay .light{background:#ffffff80}.overlay .cancel{cursor:default;height:100%;position:absolute;width:100%}.overlay.expanded{opacity:1;pointer-events:auto;visibility:visible}.overlay.expanded aside{transform:translate(calc(var(--aside-width) * -1))}
