.abr-cover-configurator__shape {
  height: 100%;
  width: 100%;
  clip-path: none;
  background-color: #fff;
  /*border:1px solid rgb(97, 97, 97);*/
  cursor: pointer;
}

.abr-cover-configurator__shape > div {
  height: calc(100% - 2px);
  width: calc(100% - 2px);
  clip-path: none;
  background-color: #fff;
  cursor: pointer;
  position: relative;
  left:1px;
  top:1px;
}

.abr-cover-configurator__shape > div > div {
  height: calc(100% - 2px);
  width: calc(100% - 2px);
  clip-path: none;
  background-color: #EEEEEE;
  border: 3px solid #595959;
  box-sizing: border-box;
  cursor: pointer;
  position: relative;
  left:1px;
  top:1px;
}

.abr-cover-configurator__shape:hover > div {
  filter: brightness(85%);
}


.abr-cover-configurator__shape--circle, .abr-cover-configurator__shape--circle > div,.abr-cover-configurator__shape--circle > div > div {
  border-radius: 50%;
}

.abr-cover-configurator__shape--ellipse-or-taper-ico {
  /*clip-path: path("M 20 0 Q 100 -30 180 0 Q 210 100 180 180 Q 100 210 20 180 Q -10 100 20 0 Z");*/
  /*border-radius: 10% / 50%;*/
}

.abr-cover-configurator__shape--ellipse-or-taper {
  transition: none!important;
}

.abr-cover-configurator__shape--ellipse-or-taper-ico {
  clip-path: polygon(7.5% 7.5%, 28.75% 1.88%, 50% 0%, 71.25% 1.88%, 92.5% 7.5%, 98.13% 28.75%, 100% 50%, 98.13% 71.25%, 92.5% 92.5%, 71.25% 98.13%, 50% 100%, 28.75% 98.13%, 7.5% 92.5%, 1.88% 71.25%, 0% 50%, 1.88% 28.75%);
}

.abr-cover-configurator__shape--ellipse-or-taper-ico>div {
  clip-path: polygon(7.5% 7.5%, 28.75% 1.88%, 50% 0%, 71.25% 1.88%, 92.5% 7.5%, 98.13% 28.75%, 100% 50%, 98.13% 71.25%, 92.5% 92.5%, 71.25% 98.13%, 50% 100%, 28.75% 98.13%, 7.5% 92.5%, 1.88% 71.25%, 0% 50%, 1.88% 28.75%);
}

.abr-cover-configurator__shape--ellipse-or-taper-ico>div>div {
  clip-path: polygon(7.5% 7.5%, 28.75% 1.88%, 50% 0%, 71.25% 1.88%, 92.5% 7.5%, 98.13% 28.75%, 100% 50%, 98.13% 71.25%, 92.5% 92.5%, 71.25% 98.13%, 50% 100%, 28.75% 98.13%, 7.5% 92.5%, 1.88% 71.25%, 0% 50%, 1.88% 28.75%);
}


.abr-cover-configurator__shape--square {
  
}

.abr-cover-configurator__shape--rounded-square {
  border-radius: 20px;
}

.abr-cover-configurator__shape--rounded-square > div {
  border-radius: 19px;
}

.abr-cover-configurator__shape--rounded-square > div > div{
  border-radius: 18px;
}

.abr-cover-configurator__shape--rounded-square.abr-cover-configurator__technical-sketch__shape {
  border-radius: 28px;
}

.abr-cover-configurator__shape--one-cut-corner, .abr-cover-configurator__shape--one-cut-corner > div, .abr-cover-configurator__shape--one-cut-corner > div > div {
  clip-path: polygon(0% 12%, 8.4% 0%, 61.6% 0%, 73.6% 3.6%, 96.4% 26.4%, 100% 38.4%, 100% 91.6%, 88% 100%, 12% 100%, 0% 88%);
}

.abr-cover-configurator__shape--one-cut-and-three-rounded-corners {
  clip-path: polygon(0% 12%, 8.4% 0%, 61.6% 0%, 73.6% 3.6%, 96.4% 26.4%, 100% 38.4%, 100% 91.6%, 88% 100%, 12% 100%, 0% 88%);
  border-radius: 20px;
}

.abr-cover-configurator__shape--one-cut-and-three-rounded-corners > div {
  clip-path: polygon(0% 12%, 8.4% 0%, 61.6% 0%, 73.6% 3.6%, 96.4% 26.4%, 100% 38.4%, 100% 91.6%, 88% 100%, 12% 100%, 0% 88%);
  border-radius: 19px;
}

.abr-cover-configurator__shape--one-cut-and-three-rounded-corners > div > div {
  clip-path: polygon(0% 12%, 8.4% 0%, 61.6% 0%, 73.6% 3.6%, 96.4% 26.4%, 100% 38.4%, 100% 91.6%, 88% 100%, 12% 100%, 0% 88%);
  border-radius: 18px;
}

.abr-cover-configurator__shape--one-cut-and-three-rounded-corners.abr-cover-configurator__technical-sketch__shape {
  border-radius: 28px;
}

.abr-cover-configurator__shape--two-cut-corners, .abr-cover-configurator__shape--two-cut-corners > div,.abr-cover-configurator__shape--two-cut-corners > div > div {
  clip-path: polygon(0% 12%, 8.4% 0%, 61.6% 0%, 73.6% 3.6%, 96.4% 26.4%, 100% 34.8%, 100% 65.2%, 96.4% 73.6%, 73.6% 96.4%, 61.6% 100%, 8.4% 100%, 0% 88%);
}

.abr-cover-configurator__shape--two-cut-and-two-rounded-corners {
  clip-path: polygon(0% 12%, 8.4% 0%, 61.6% 0%, 73.6% 3.6%, 96.4% 26.4%, 100% 34.8%, 100% 65.2%, 96.4% 73.6%, 73.6% 96.4%, 61.6% 100%, 8.4% 100%, 0% 88%);
  border-radius: 20px;
}

.abr-cover-configurator__shape--two-cut-and-two-rounded-corners > div {
  clip-path: polygon(0% 12%, 8.4% 0%, 61.6% 0%, 73.6% 3.6%, 96.4% 26.4%, 100% 34.8%, 100% 65.2%, 96.4% 73.6%, 73.6% 96.4%, 61.6% 100%, 8.4% 100%, 0% 88%);
  border-radius: 19px;
}

.abr-cover-configurator__shape--two-cut-and-two-rounded-corners > div > div {
  clip-path: polygon(0% 12%, 8.4% 0%, 61.6% 0%, 73.6% 3.6%, 96.4% 26.4%, 100% 34.8%, 100% 65.2%, 96.4% 73.6%, 73.6% 96.4%, 61.6% 100%, 8.4% 100%, 0% 88%);
  border-radius: 18px;
}

.abr-cover-configurator__shape--two-cut-and-two-rounded-corners.abr-cover-configurator__technical-sketch__shape {
  border-radius: 28px;
}

.abr-cover-configurator__shape--four-cut-corners {
  clip-path: polygon(13.2% 1.8%, 23.4% 0%, 76.6% 0%, 86.8% 1.8%, 98.2% 13.2%, 100% 23.4%, 100% 76.6%, 98.2% 86.8%, 86.8% 98.2%, 76.6% 100%, 23.4% 100%, 13.2% 98.2%, 1.8% 86.8%, 0% 76.6%, 0% 23.4%, 1.8% 13.2%);
}

.abr-cover-configurator__shape--four-cut-corners > div {
  clip-path: polygon(13.2% 1.8%, 23.4% 0%, 76.6% 0%, 86.8% 1.8%, 98.2% 13.2%, 100% 23.4%, 100% 76.6%, 98.2% 86.8%, 86.8% 98.2%, 76.6% 100%, 23.4% 100%, 13.2% 98.2%, 1.8% 86.8%, 0% 76.6%, 0% 23.4%, 1.8% 13.2%);
}

.abr-cover-configurator__shape--four-cut-corners > div > div {
  clip-path: polygon(12.32% 1.68%, 22.64% 0%, 77.36% 0%, 87.68% 1.68%, 98.32% 12.32%, 100% 22.64%, 100% 77.36%, 98.32% 87.68%, 87.68% 98.32%, 77.36% 100%, 22.64% 100%, 12.32% 98.32%, 1.68% 87.68%, 0% 77.36%, 0% 22.64%, 1.68% 12.32%);
}

.abr-cover-configurator__shape--rectangle {
  /* !important needed: a later, higher-specificity rule in
     spa-cover-configurator.css (.abr-cover-configurator__shapes-list > div >
     .abr-cover-configurator__shape, two classes) was silently forcing this
     back to a square in the shape-picker list. */
  width: 60% !important;
}

.abr-cover-configurator__shape--rectangle__parent {
  width: clamp(138px, 12vw, 180px)!important;
}

.abr-cover-configurator__shape--rectangle__parent .abr-cover-configurator__shape--rectangle {
  /* !important needed to beat the base rule's own !important (added so
     that rule could beat spa-cover-configurator.css's square-forcing
     rule) -- without it this technical-sketch context was getting stuck
     at 60% width instead of filling its (already correctly narrow)
     __parent box, doubling the narrowing and distorting the shape. */
  width: 100% !important;
}

.abr-cover-configurator__shape--rounded-rectangle {
  border-radius: 14px;
  width: 60% !important;
}

.abr-cover-configurator__shape--rounded-rectangle__parent {
  width: clamp(138px, 12vw, 180px)!important;
}

.abr-cover-configurator__shape--rounded-rectangle__parent .abr-cover-configurator__shape--rounded-rectangle {
  width: 100% !important;
}

.abr-cover-configurator__shape--rounded-rectangle > div {
  border-radius: 13px;
}

.abr-cover-configurator__shape--rounded-rectangle > div > div {
  border-radius: 12px;
}

.abr-cover-configurator__shape--rounded-rectangle.abr-cover-configurator__technical-sketch__shape {
  border-radius: 28px;
}

.abr-cover-configurator__shape--rectangle-cut-corners {
  width: 60% !important;
  clip-path: polygon(17.6% 1.56%, 27.2% 0%, 72.8% 0%, 82.4% 1.56%, 97.6% 11.44%, 100% 21.88%, 100% 78.12%, 97.6% 88.56%, 82.4% 98.44%, 72.8% 100%, 27.2% 100%, 17.6% 98.44%, 2.4% 88.56%, 0% 78.12%, 0% 21.88%, 2.4% 11.44%);
}

.abr-cover-configurator__shape--rectangle-cut-corners__parent {
  width: clamp(138px, 12vw, 180px)!important;
}

.abr-cover-configurator__shape--rectangle-cut-corners__parent .abr-cover-configurator__shape--rectangle-cut-corners {
  width: 100% !important;
}

.abr-cover-configurator__shape--rectangle-cut-corners > div {
  clip-path: polygon(17.6% 1.56%, 27.2% 0%, 72.8% 0%, 82.4% 1.56%, 97.6% 11.44%, 100% 21.88%, 100% 78.12%, 97.6% 88.56%, 82.4% 98.44%, 72.8% 100%, 27.2% 100%, 17.6% 98.44%, 2.4% 88.56%, 0% 78.12%, 0% 21.88%, 2.4% 11.44%);
}

.abr-cover-configurator__shape--rectangle-cut-corners > div > div {
  clip-path: polygon(16.72% 1.44%, 26.44% 0%, 73.56% 0%, 83.28% 1.44%, 97.72% 10.56%, 100% 21.12%, 100% 78.88%, 97.72% 89.44%, 83.28% 98.56%, 73.56% 100%, 26.44% 100%, 16.72% 98.56%, 2.28% 89.44%, 0% 78.88%, 0% 21.12%, 2.28% 10.56%);
}

.abr-cover-configurator__shape--octagon, .abr-cover-configurator__shape--octagon > div, .abr-cover-configurator__shape--octagon > div > div {
  clip-path: polygon(26.4% 3.6%, 34.8% 0%, 65.2% 0%, 73.6% 3.6%, 96.4% 26.4%, 100% 34.8%, 100% 65.2%, 96.4% 73.6%, 73.6% 96.4%, 65.2% 100%, 34.8% 100%, 26.4% 96.4%, 3.6% 73.6%, 0% 65.2%, 0% 34.8%, 3.6% 26.4%);
}

.abr-cover-configurator__shape--hexagon {
  width: 88%;
}

/* Every other diagonal shape clips its outer + middle wrapper div to its own
   polygon (see e.g. octagon above), so the hover/selected-state background
   color painted on those layers is shaped correctly and no square corner
   shows behind the SVG icon. Hexagon was missing this entirely. */
.abr-cover-configurator__shape--hexagon, .abr-cover-configurator__shape--hexagon > div {
  clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
}

.abr-cover-configurator__shape--hexagon__parent {
  width: clamp(183px, 15.8vw, 236px)!important;
}

.abr-cover-configurator__shape--hexagon__parent .abr-cover-configurator__shape--hexagon {
  width: 100%;
}

/* ===== SVG-based diagonal shapes (2026-09-03) =====
   CSS border on a clip-path diagonal edge was rendering unreliably in production
   (confirmed via direct screenshots -- border simply absent on every diagonal
   facet, present on orthogonal ones), regardless of bevel amount. These 9 shapes
   render via an inline SVG background image instead, which uses a real stroke
   with proper corner joins and does not share that rendering path. Outer/middle
   layers (hover brightness, selected-state black ring) are untouched. ===== */

.abr-cover-configurator__shape--one-cut-corner > div > div { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%27400%27%20height%3D%27400%27%20viewBox%3D%270%200%20100%20100%27%3E%3Cpolygon%20points%3D%272%2C2%2069.2%2C2%2098%2C30.8%2098%2C98%202%2C98%27%20fill%3D%27%23eeeeee%27%20stroke%3D%27%23595959%27%20stroke-width%3D%274%27%20stroke-linejoin%3D%27miter%27%2F%3E%3C%2Fsvg%3E"); background-size: 100% 100%; background-repeat: no-repeat; background-color: transparent; border: none; clip-path: none; }
.abr-cover-configurator__shape--one-cut-and-three-rounded-corners > div > div { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%27400%27%20height%3D%27400%27%20viewBox%3D%270%200%20100%20100%27%3E%3Cpath%20d%3D%27M21.2%2C2%20L69.2%2C2%20L98%2C30.8%20L98%2C78.8%20A19.2%2C19.2%200%200%201%2078.8%2C98%20L21.2%2C98%20A19.2%2C19.2%200%200%201%202%2C78.8%20L2%2C21.2%20A19.2%2C19.2%200%200%201%2021.2%2C2%20Z%27%20fill%3D%27%23eeeeee%27%20stroke%3D%27%23595959%27%20stroke-width%3D%274%27%20stroke-linejoin%3D%27miter%27%2F%3E%3C%2Fsvg%3E"); background-size: 100% 100%; background-repeat: no-repeat; background-color: transparent; border: none; clip-path: none; border-radius: 0; }
.abr-cover-configurator__shape--two-cut-corners > div > div { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%27400%27%20height%3D%27400%27%20viewBox%3D%270%200%20100%20100%27%3E%3Cpolygon%20points%3D%272%2C2%2069.2%2C2%2098%2C30.8%2098%2C69.2%2069.2%2C98%202%2C98%27%20fill%3D%27%23eeeeee%27%20stroke%3D%27%23595959%27%20stroke-width%3D%274%27%20stroke-linejoin%3D%27miter%27%2F%3E%3C%2Fsvg%3E"); background-size: 100% 100%; background-repeat: no-repeat; background-color: transparent; border: none; clip-path: none; }
.abr-cover-configurator__shape--two-cut-and-two-rounded-corners > div > div { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%27400%27%20height%3D%27400%27%20viewBox%3D%270%200%20100%20100%27%3E%3Cpath%20d%3D%27M21.2%2C2%20L69.2%2C2%20L98%2C30.8%20L98%2C69.2%20L69.2%2C98%20L21.2%2C98%20A19.2%2C19.2%200%200%201%202%2C78.8%20L2%2C21.2%20A19.2%2C19.2%200%200%201%2021.2%2C2%20Z%27%20fill%3D%27%23eeeeee%27%20stroke%3D%27%23595959%27%20stroke-width%3D%274%27%20stroke-linejoin%3D%27miter%27%2F%3E%3C%2Fsvg%3E"); background-size: 100% 100%; background-repeat: no-repeat; background-color: transparent; border: none; clip-path: none; border-radius: 0; }
.abr-cover-configurator__shape--four-cut-corners > div > div { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%27400%27%20height%3D%27400%27%20viewBox%3D%270%200%20100%20100%27%3E%3Cpolygon%20points%3D%2716.4%2C2%2083.6%2C2%2098%2C16.4%2098%2C83.6%2083.6%2C98%2016.4%2C98%202%2C83.6%202%2C16.4%27%20fill%3D%27%23eeeeee%27%20stroke%3D%27%23595959%27%20stroke-width%3D%274%27%20stroke-linejoin%3D%27miter%27%2F%3E%3C%2Fsvg%3E"); background-size: 100% 100%; background-repeat: no-repeat; background-color: transparent; border: none; clip-path: none; }
.abr-cover-configurator__shape--rectangle-cut-corners > div > div {
  /* Unlike the other 8 diagonal shapes, this one's box isn't square
     (width:60% of a square container), so a viewBox matching the square
     "4 Cut Corners" icon and stretched via background-size:100% 100%
     distorted the corner angle. This SVG's own viewBox (100x130) matches
     the box's actual ~0.77 aspect ratio instead, with the SAME absolute
     14.4-unit corner cut as "4 Cut Corners" -- so background-size:100%
     100% becomes a uniform (non-distorting) scale, and the shape reads
     as a true rectangle with proportional corner nips instead of a
     stretched square. */
  background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%27400%27%20height%3D%27520%27%20viewBox%3D%270%200%20100%20130%27%3E%3Cpolygon%20points%3D%2716.4%2C2%2083.6%2C2%2098%2C16.4%2098%2C113.6%2083.6%2C128%2016.4%2C128%202%2C113.6%202%2C16.4%27%20fill%3D%27%23eeeeee%27%20stroke%3D%27%23595959%27%20stroke-width%3D%274%27%20stroke-linejoin%3D%27miter%27%2F%3E%3C%2Fsvg%3E");
  background-size: 100% 100%; background-repeat: no-repeat; background-color: transparent; border: none; clip-path: none;
}
.abr-cover-configurator__shape--octagon > div > div { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%27400%27%20height%3D%27400%27%20viewBox%3D%270%200%20100%20100%27%3E%3Cpolygon%20points%3D%2730.8%2C2%2069.2%2C2%2098%2C30.8%2098%2C69.2%2069.2%2C98%2030.8%2C98%202%2C69.2%202%2C30.8%27%20fill%3D%27%23eeeeee%27%20stroke%3D%27%23595959%27%20stroke-width%3D%274%27%20stroke-linejoin%3D%27miter%27%2F%3E%3C%2Fsvg%3E"); background-size: 100% 100%; background-repeat: no-repeat; background-color: transparent; border: none; clip-path: none; }
.abr-cover-configurator__shape--hexagon > div > div { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%27400%27%20height%3D%27400%27%20viewBox%3D%270%200%20100%20100%27%3E%3Cpolygon%20points%3D%2750%2C2%2098%2C26%2098%2C74%2050%2C98%202%2C74%202%2C26%27%20fill%3D%27%23eeeeee%27%20stroke%3D%27%23595959%27%20stroke-width%3D%274%27%20stroke-linejoin%3D%27miter%27%2F%3E%3C%2Fsvg%3E"); background-size: 100% 100%; background-repeat: no-repeat; background-color: transparent; border: none; clip-path: none; }
.abr-cover-configurator__shape--ellipse-or-taper-ico > div > div { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%27400%27%20height%3D%27400%27%20viewBox%3D%270%200%20100%20100%27%3E%3Cpolygon%20points%3D%279.2%2C9.2%2029.6%2C3.8%2050%2C2%2070.4%2C3.8%2090.8%2C9.2%2096.2%2C29.6%2098%2C50%2096.2%2C70.4%2090.8%2C90.8%2070.4%2C96.2%2050%2C98%2029.6%2C96.2%209.2%2C90.8%203.8%2C70.4%202%2C50%203.8%2C29.6%27%20fill%3D%27%23eeeeee%27%20stroke%3D%27%23595959%27%20stroke-width%3D%274%27%20stroke-linejoin%3D%27miter%27%2F%3E%3C%2Fsvg%3E"); background-size: 100% 100%; background-repeat: no-repeat; background-color: transparent; border: none; clip-path: none; }


/* ===== Technical sketch (measurement-entry TOP VIEW diagram) fix v2 (2026-09-04) =====
   v1 used a background-image (same technique as the shape-picker swatches
   above), but AbrCoverConfigurator3.js sets an INLINE background-image on this
   same element whenever a color/material swatch is picked (the color texture
   itself) -- inline styles beat class-based CSS, so that silently overwrote the
   shape outline with a plain rectangular texture the moment a color was chosen.
   clip-path avoids the conflict entirely and matches how color texture is
   actually meant to be shaped here. Same corrected geometry as the swatches,
   just as percentage clip-path polygons instead of an SVG image; rounded
   corners are a dense point ring along the same radius since clip-path has no
   percentage-based arc syntax. ellipse-or-taper is excluded, as before -- it
   already has its own correct, JS-computed pixel-based clip-path. ===== */
.abr-cover-configurator__technical-sketch__shape.abr-cover-configurator__shape--one-cut-corner { clip-path: polygon(0% 0%, 70% 0%, 100% 30%, 100% 100%, 0% 100%) !important; border-radius: 0; }
.abr-cover-configurator__technical-sketch__shape.abr-cover-configurator__shape--two-cut-corners { clip-path: polygon(0% 0%, 70% 0%, 100% 30%, 100% 70%, 70% 100%, 0% 100%) !important; border-radius: 0; }
.abr-cover-configurator__technical-sketch__shape.abr-cover-configurator__shape--four-cut-corners { clip-path: polygon(15% 0%, 85% 0%, 100% 15%, 100% 85%, 85% 100%, 15% 100%, 0% 85%, 0% 15%) !important; border-radius: 0; }
.abr-cover-configurator__technical-sketch__shape.abr-cover-configurator__shape--rectangle-cut-corners { clip-path: polygon(15% 0%, 85% 0%, 100% 9.86%, 100% 90.14%, 85% 100%, 15% 100%, 0% 90.14%, 0% 9.86%) !important; border-radius: 0; }
.abr-cover-configurator__technical-sketch__shape.abr-cover-configurator__shape--octagon { clip-path: polygon(30% 0%, 70% 0%, 100% 30%, 100% 70%, 70% 100%, 30% 100%, 0% 70%, 0% 30%) !important; border-radius: 0; }
.abr-cover-configurator__technical-sketch__shape.abr-cover-configurator__shape--hexagon { clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%) !important; border-radius: 0; }
.abr-cover-configurator__technical-sketch__shape.abr-cover-configurator__shape--one-cut-and-three-rounded-corners { clip-path: polygon(20% 0%, 70% 0%, 100% 30%, 100% 80%, 99.32% 85.18%, 97.32% 90%, 94.15% 94.15%, 90% 97.32%, 85.18% 99.32%, 80% 100%, 20% 100%, 14.82% 99.32%, 10% 97.32%, 5.85% 94.15%, 2.68% 90%, 0.68% 85.18%, 0% 80%, 0% 20%, 0.68% 14.82%, 2.68% 10%, 5.85% 5.85%, 10% 2.68%, 14.82% 0.68%) !important; border-radius: 0; }
.abr-cover-configurator__technical-sketch__shape.abr-cover-configurator__shape--two-cut-and-two-rounded-corners { clip-path: polygon(20% 0%, 70% 0%, 100% 30%, 100% 70%, 70% 100%, 20% 100%, 14.82% 99.32%, 10% 97.32%, 5.85% 94.15%, 2.68% 90%, 0.68% 85.18%, 0% 80%, 0% 20%, 0.68% 14.82%, 2.68% 10%, 5.85% 5.85%, 10% 2.68%, 14.82% 0.68%) !important; border-radius: 0; }