update

themes/classic/assets/css/custom.scss

@@ -224,6 +224,10 @@ a {
               border-radius: 1px;
               column-gap: 8px;
 
+              &:hover {
+                background: #E79332;
+              }
+
               i {
                 font-size: 15px;
                 margin-bottom: 2px;
@@ -649,6 +653,44 @@ body#product {
                 transition-delay: 400ms;
               }
 
+              .color_select {
+                display: flex;
+                gap: 10px;
+
+                li {
+                  margin: 0;
+                  padding: 0;
+
+                  input {
+                    display: none;
+
+                    &:checked+span {
+                      border: 0 !important;
+
+                      &::before {
+                        content: '';
+                        display: block;
+                        position: absolute;
+                        top: -2px;
+                        left: -2px;
+                        height: 30px;
+                        width: 30px;
+                        border: 1px solid #000;
+                        border-radius: 50%;
+                      }
+                    }
+                  }
+
+                  span {
+                    margin: 0;
+                    padding: 0;
+                    height: 26px;
+                    width: 26px;
+                    border-radius: 50%;
+                  }
+                }
+              }
+
               &.active {
                 &::before {
                   opacity: 1;
@@ -901,6 +943,10 @@ body#product {
                   font-family: $fInter;
                   text-transform: initial;
 
+                  &:hover {
+                    background: #110E0C;
+                  }
+
                   .material-icons {
                     line-height: 1;
                     font-size: 14px;
@@ -1007,6 +1053,10 @@ body#product {
               flex-wrap: wrap;
               gap: 10px;
               padding-top: 20px;
+
+              img {
+                height: 35px;
+              }
             }
           }
         }
@@ -2322,11 +2372,8 @@ body#category {
 }
 
 .home-slider {
-  @media (min-width: 1500px) {
-    margin-left: 50%;
-    transform: translateX(-50%);
-    min-width: 1440px;
-  }
+  padding-right: 10px;
+  padding-left: 10px;
 
   .carousel-item {
     .caption {
@@ -3169,6 +3216,7 @@ body#authentication {
 
       &:hover {
         color: #E79332;
+        text-decoration: underline;
 
         span {
           color: #E79332;

themes/classic/templates/catalog/_partials/product-variants.tpl

@@ -78,7 +78,7 @@
                 </div>
             </div>
           {elseif $group.group_type == 'color'}
-            <ul id="group_{$id_attribute_group}">
+            <ul id="group_{$id_attribute_group}" class="color_select">
               {foreach from=$group.attributes key=id_attribute item=group_attribute}
                 <li class="float-xs-left input-container">
                   <label aria-label="{$group_attribute.name}">