.elementor-78642 .elementor-element.elementor-element-35a9b0b{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-78642 .elementor-element.elementor-element-a52b8f8{--display:flex;--min-height:0px;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-78642 .elementor-element.elementor-element-a52b8f8.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-78642 .elementor-element.elementor-element-67fd9c9{width:var( --container-widget-width, 45% );max-width:45%;--container-widget-width:45%;--container-widget-flex-grow:0;}.elementor-78642 .elementor-element.elementor-element-67fd9c9.elementor-element{--align-self:center;}.elementor-78642 .elementor-element.elementor-element-59bd5bd{width:initial;max-width:initial;}.elementor-78642 .elementor-element.elementor-element-b813600{--display:flex;--min-height:0px;--padding-top:0px;--padding-bottom:15px;--padding-left:0px;--padding-right:0px;}.elementor-78642 .elementor-element.elementor-element-b813600.e-con{--align-self:center;}.elementor-78642 .elementor-element.elementor-element-2c8485b{width:100%;max-width:100%;}.elementor-78642 .elementor-element.elementor-element-2c8485b.elementor-element{--align-self:center;}.elementor-78642 .elementor-element.elementor-element-c89c944{--display:flex;}@media(max-width:1024px){.elementor-78642 .elementor-element.elementor-element-67fd9c9{--container-widget-width:445px;--container-widget-flex-grow:0;width:var( --container-widget-width, 445px );max-width:445px;}}@media(max-width:767px){.elementor-78642 .elementor-element.elementor-element-35a9b0b{--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-78642 .elementor-element.elementor-element-67fd9c9{--container-widget-width:337px;--container-widget-flex-grow:0;width:var( --container-widget-width, 337px );max-width:337px;}}@media(min-width:768px){.elementor-78642 .elementor-element.elementor-element-a52b8f8{--width:100%;}}/* Start custom CSS for container, class: .elementor-element-b813600 */.swatch-scroll-wrapper {
  overflow-x: auto;
  white-space: nowrap;
  padding: 10px 0;
  -webkit-overflow-scrolling: touch;
}

.swatch-track {
  display: inline-flex;
  gap: 12px;
}

.multi-swatch {
  flex: 0 0 auto;
  width: 60px;
  height: 56px;
  border-radius: 50%;
  border: 2px solid #ccc;
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-35a9b0b */.swatch-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
  justify-items: center;
  margin-bottom: 20px;
}

/* Base swatch styles */
.multi-swatch {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  border: 2px solid #fff;
  cursor: pointer;
  box-shadow: 0 0 2px rgba(0, 0, 0, 0.15);
  transition: all 0.3s ease;
}

.multi-swatch:hover {
  transform: scale(1.1);
}

.multi-swatch.active {
  border: 2px solid #000;
  box-shadow: 0 0 0 2px #000;
}

/* Swatch Colours (one for each theme) */
.swatch-1 {
  background: conic-gradient(
    #9c2d35 0% 25%, 
    #b89a58 25% 50%, 
    #121311 50% 75%, 
    #fffeeb 75% 100%
  );
}

.swatch-2 {
  background: conic-gradient(
    #000000 0% 25%,
    #d4c5a8 25% 50%,
    #f0e9dc 50% 75%,
    #f0e9dc 75% 100%
  );
}

.swatch-3 {
  background: conic-gradient(
    #afc7d7 0% 25%,
    #dbbb8b 25% 50%,
    #6b8688 50% 75%,
    #dcd1ba 75% 100%
  );
}

.swatch-4 {
  background: conic-gradient(
    #e2e1e5 0% 25%,
    #d8c0da 25% 50%,
    #602f7b 50% 75%,
    #602f7b 75% 100%
  );
}

.swatch-5 {
  background: conic-gradient(
    #e3b44f 0% 25%,
    #f3e7cd 25% 50%,
    #72703a 50% 75%,
    #72703a 75% 100%
  );
}

.swatch-6 {
  background: conic-gradient(
    #f0b9a3 0% 25%,
    #f9e1bb 25% 50%,
    #df6e90 50% 75%,
    #df6d92 75% 100%
  );
}

.swatch-7 {
  background: conic-gradient(
    #8d1b15 0% 25%,
    #ad865b 25% 50%,
    #213b32 50% 75%,
    #213b32 75% 100%
  );
}

.swatch-8 {
  background: conic-gradient(
    #e1e2d5 0% 25%,
    #768472 25% 50%,
    #b3c0b2 50% 75%,
    #b3c0b2 75% 100%
  );
}

.swatch-9 {
  background: conic-gradient(
    #d34078 0% 25%,
    #d34078 25% 50%,
    #fcf1f2 50% 75%,
    #fcf1f2 75% 100%
  );
}

.swatch-10 {
  background: conic-gradient(
    #d26b38 0% 25%,
    #f1dabf 25% 50%,
    #e47d3a 50% 75%,
    #e47d3a 75% 100%
  );
}

.swatch-11 {
  background: conic-gradient(
    #214b59 0% 25%,
    #dddddd 25% 50%,
    #abc0d7 50% 75%,
    #abc0d7 75% 100%
  );
}

.swatch-12 {
  background: conic-gradient(
    #f3dac6 0% 25%,
    #f9eed1 25% 50%,
    #ecc8de 50% 75%,
    #ecc8de 75% 100%
  );
}

.swatch-13 {
  background: conic-gradient(
    #9ba491 0% 25%,
    #424d48 25% 50%,
    #e6e0d7 50% 75%,
    #e6e0d7 75% 100%
  );
}

.swatch-14 {
  background: conic-gradient(
    #f0ece8 0% 25%,
    #5a1528 25% 50%,
    #dec2b7 50% 75%,
    #dec2b7 75% 100%
  );
}

.swatch-15 {
  background: conic-gradient(
    #b3d0d9 0% 25%,
    #6294a4 25% 50%,
    #1b353d 50% 75%,
    #efefef 75% 100%
  );
}

.swatch-16 {
  background: conic-gradient(
    #f3e5e6 0% 25%,
    #f5c9b3 25% 50%,
    #90313b 50% 75%,
    #ecdcbb 75% 100%
  );
}

.swatch-17 {
  background: conic-gradient(
    #f1dbdf 0% 25%,
    #e1e9ca 25% 50%,
    #7b795d 50% 75%,
    #e9e7e0 75% 100%
  );
}

.swatch-18 {
  background: conic-gradient(
    #dddddd 0% 25%,
    #122945 25% 50%,
    #e1d3c0 50% 75%,
    #e1d3c0 75% 100%
  );
}

.swatch-19 {
  background: conic-gradient(
    #f1eff0 0% 25%,
    #c2c2c2 25% 50%,
    #000000 50% 75%,
    #000000 75% 100%
  );
}

.swatch-20 {
  background: conic-gradient(
    #f1f1f1 0% 25%,
    #f1f1f1 25% 50%,
    #000000 50% 75%,
    #000000 75% 100%
  );
}/* End custom CSS */