/* MegaProduct - Pisafelpudos V6
 * Cargar exclusivamente en la tienda Pisafelpudos, despues de megaproduct.css.
 * V6: todos los bordes afinados a 1px.
 */

#megaproduct,
#megagroups,
#mpproduct-step {
  --mp-pisa-gold: #b7791f;
  --mp-pisa-gold-hover: #955f18;
  --mp-pisa-border: #77706a;
  --mp-pisa-border-width: 1px;
  --mp-pisa-border-focus: #b7791f;
  --mp-pisa-background: #ffffff;
  --mp-pisa-text: #1f1f1f;
  background: var(--mp-pisa-background) !important;
  color: var(--mp-pisa-text);
}

/* V3: un unico marco alrededor del contenido configurable. */
#megagroups #mpimages {
  padding: 18px !important;
  border: 1px solid var(--mp-pisa-border) !important;
  border-radius: 4px !important;
  background: #fff !important;
  box-shadow: none !important;
  box-sizing: border-box;
}

/* El configurador y sus secciones dejan de usar fondos grises. */
#megaproduct .mpstep,
#megagroups .mpstep,
#mpproduct-step .mpstep,
#megaproduct .mega-attrlabel,
#megagroups .mega-attrlabel,
#mpproduct-step .mega-attrlabel,
#mpproduct-step .mp-step-measures,
#megagroups .mp-step-measures {
  background: var(--mp-pisa-background) !important;
  box-shadow: none !important;
}

/* Cabecera de cada grupo, como Espesor o Medidas. */
#megagroups .mpstep > .mega-attrlabel,
#mpproduct-step .mpstep > .mega-attrlabel,
#megagroups .mega-attrlabel:not(#megalabel_0) {
  width: 100% !important;
  margin: 5px 0 10px !important;
  padding: 9px 12px !important;
  border: var(--mp-pisa-border-width) solid #5f5954 !important;
  border-radius: 4px !important;
  background: #fff !important;
  box-shadow: none !important;
  box-sizing: border-box;
}

#megagroups .mega-attrlabel .mega_title,
#mpproduct-step .mega-attrlabel .mega_title {
  color: #171717 !important;
  font-weight: 700 !important;
}

/* Campos de medidas, cantidad, textos y desplegables. */
#megaproduct input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="button"]):not([type="submit"]),
#megagroups input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="button"]):not([type="submit"]),
#mpproduct-step input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="button"]):not([type="submit"]),
#megaproduct select,
#megagroups select,
#mpproduct-step select,
#megaproduct textarea,
#megagroups textarea,
#mpproduct-step textarea {
  border: var(--mp-pisa-border-width) solid var(--mp-pisa-border) !important;
  border-radius: 4px !important;
  background: #fff !important;
  box-shadow: none !important;
}

#megaproduct input:focus,
#megagroups input:focus,
#mpproduct-step input:focus,
#megaproduct select:focus,
#megagroups select:focus,
#mpproduct-step select:focus,
#megaproduct textarea:focus,
#megagroups textarea:focus,
#mpproduct-step textarea:focus {
  border-color: var(--mp-pisa-border-focus) !important;
  outline: 1px solid rgba(183, 121, 31, 0.18) !important;
  outline-offset: 0;
  box-shadow: none !important;
}

/* Las medidas no llevan tarjeta exterior; el borde queda en cada campo. */
#mpproduct-step .mp-step-measures > div,
#megagroups .mp-step-measures > div,
#megaproduct .mp-measures {
  border: 0 !important;
  border-radius: 4px !important;
  background: #fff !important;
  box-shadow: none !important;
}

/* Resumen de seleccion. */
#megagroups #show-result-container,
#mpproduct-step #show-result-container,
#megagroups #show-result-container.resultFixed,
#mpproduct-step #show-result-container.resultFixed,
#megagroups .mp-standard-plus-summary,
#mpproduct-step .mp-standard-plus-summary {
  border: var(--mp-pisa-border-width) solid var(--mp-pisa-border) !important;
  border-radius: 4px !important;
  background: #fff !important;
  box-shadow: none !important;
}

/* Tarjetas de precio y cantidad. */
#mpproduct-step #megalabel_0,
#megagroups #megalabel_0,
#mpproduct-step #step-quantity,
#mpproduct-step #mp-step-quantity,
#megagroups #step-quantity,
#megagroups #mp-step-quantity,
#mpproduct-step #megalabel_0.mp-purchase-price,
#mpproduct-step #step-quantity.mp-purchase-qty,
#mpproduct-step #mp-step-quantity.mp-purchase-qty {
  border: var(--mp-pisa-border-width) solid var(--mp-pisa-border) !important;
  border-radius: 4px !important;
  background: #fff !important;
  box-shadow: none !important;
}

/* Boton principal de calcular/anadir al carrito. */
#megaproduct #btnCalculePrice,
#megaproduct #btnAddProduct,
#megagroups #btnCalculePrice,
#megagroups #btnAddProduct,
#mpproduct-step #btnCalculePrice,
#mpproduct-step #btnAddProduct,
#megagroups .mp-result-button #btnAddProduct,
#mpproduct-step .mp-result-button #btnAddProduct {
  border: var(--mp-pisa-border-width) solid var(--mp-pisa-gold) !important;
  border-radius: 4px !important;
  background: var(--mp-pisa-gold) !important;
  color: #fff !important;
  box-shadow: none !important;
}

#megaproduct #btnCalculePrice:hover,
#megaproduct #btnAddProduct:hover,
#megagroups #btnCalculePrice:hover,
#megagroups #btnAddProduct:hover,
#mpproduct-step #btnCalculePrice:hover,
#mpproduct-step #btnAddProduct:hover,
#megagroups .mp-result-button #btnAddProduct:hover,
#mpproduct-step .mp-result-button #btnAddProduct:hover {
  border-color: var(--mp-pisa-gold-hover) !important;
  background: var(--mp-pisa-gold-hover) !important;
  color: #fff !important;
}

#megaproduct #btnCalculePrice span,
#megaproduct #btnAddProduct span,
#megaproduct #btnCalculePrice i,
#megaproduct #btnAddProduct i,
#megagroups #btnCalculePrice span,
#megagroups #btnAddProduct span,
#megagroups #btnCalculePrice i,
#megagroups #btnAddProduct i,
#mpproduct-step #btnCalculePrice span,
#mpproduct-step #btnAddProduct span,
#mpproduct-step #btnCalculePrice i,
#mpproduct-step #btnAddProduct i {
  color: #fff !important;
}

@media (max-width: 767px) {
  #megagroups #show-result-container,
  #mpproduct-step #show-result-container,
  #megagroups #show-result-container.resultFixed,
  #mpproduct-step #show-result-container.resultFixed {
    width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box;
  }
}
