@font-face {
  font-family: "slim";
  src: url("https://memoride.it/wp-content/themes/astra-child/fonts/MY_FONT_SLIM.otf")
    format("opentype");
}

@font-face {
  font-family: "solid";
  src: url("https://memoride.it/wp-content/themes/astra-child/fonts/MY_FONT_SOLID.otf")
    format("opentype");
}

/* css/custom-product-style.css */
.custom-3d-product-controls {
  border: 1px solid #eee;
  padding: 20px;
  margin-bottom: 20px;
}

.custom-3d-product-controls h3 {
  margin-top: 0;
}

.custom-3d-product-controls .form-row {
  margin-bottom: 15px;
}

.custom-3d-product-controls label {
  display: block;
  margin-bottom: 5px;
  font-weight: bold;
}

.custom-3d-product-controls input[type="file"],
.custom-3d-product-controls input[type="text"],
.custom-3d-product-controls input[type="number"],
.custom-3d-product-controls select {
  width: 100%;
  padding: 8px;
  box-sizing: border-box;
  border-radius: 0px !important;
  line-height: var(--ast-body-line-height, 1.7em);
}

#stl-viewer-container {
  width: 100%;
  height: 400px; /* Adatta l'altezza */
  background-color: #f0f0f0;
  border: 1px solid #ccc;
  margin-bottom: 20px;
  position: relative; /* Per messaggi di overlay */
}

#stl-viewer-container .viewer-message {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  padding: 10px 20px;
  background-color: rgba(0, 0, 0, 0.7);
  color: white;
  border-radius: 5px;
  display: none; /* Mostrato via JS */
}

.customization-step {
  display: none; /* Nascosto di default, mostrato da JS */
  margin-bottom: 20px;
  padding: 10px;
  border: 1px dashed #ddd;
}

.customization-step.active {
  display: block;
}

#custom-product-form .woocommerce-Price-amount {
  font-size: 1.5em;
  color: #77a464;
}

/* Color Selector Styles */
.color-swatch {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  cursor: pointer;
  transition: all 0.2s ease;
  /* box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); */
  border: 1px solid #ddd;
}

.color-swatch:hover {
  transform: scale(1.1);
  /* box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23); */
}

.color-swatch.selected {
  transform: scale(1.1);
}

#color-label {
  font-weight: 500;
}

#selected-color-name {
  font-weight: 600;
}