/* ==========================================
   DP Extras (WAPO triggers) – UI + show/hide
   Se carga SOLO en páginas de producto
   ========================================== */

/* Ocultar SIEMPRE por defecto */
.dp-brand-fields,
.dp-ia-fields{
  display: none !important;
  margin-top: 12px;
  padding: 14px 14px;
  border: 1px solid rgba(15,23,42,.10);
  border-radius: 14px;
  background: #fbfbfd;
  box-shadow: 0 8px 18px rgba(15,23,42,.04);
}

/* Mostrar SOLO cuando el JS añade clases */
.yith-wapo-option.dp-show-brand .dp-brand-fields{ display: block !important; }
#yith-wapo-container.dp-show-ia .dp-ia-fields{ display: block !important; }

/* Campos */
.dp-field{ margin-bottom: 14px; }
.dp-field:last-child{ margin-bottom: 0; }

.dp-field label{
  display:block;
  font-size: 13px;
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 8px;
}

.dp-help{
  font-size: 12px;
  color: rgba(15,23,42,.70);
  margin-top: 8px;
}

/* Inputs */
.dp-field input[type="text"],
.dp-field input[type="email"],
.dp-field select,
.dp-field textarea{
  width: 100%;
  padding: 10px 12px;
  border: 1px solid rgba(15,23,42,.12);
  border-radius: 12px;
  background: #fff;
  outline: none;
}

.dp-field input[type="text"]:focus,
.dp-field input[type="email"]:focus,
.dp-field select:focus,
.dp-field textarea:focus{
  border-color: rgba(43,113,208,.55);
  box-shadow: 0 0 0 3px rgba(43,113,208,.12);
}

/* File input */
.dp-field input[type="file"]{
  width: 100%;
  padding: 10px 12px;
  border: 1px dashed rgba(15,23,42,.18);
  border-radius: 12px;
  background: #fff;
}

.dp-field input[type="file"]::file-selector-button{
  margin-right: 12px;
  padding: 8px 12px;
  border: 0;
  border-radius: 10px;
  background: #2B71D0;
  color: #fff;
  font-weight: 700;
  cursor: pointer;
}

/* Dos columnas (colores) */
.dp-field--2col{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  align-items: start;
}
@media (max-width: 520px){
  .dp-field--2col{ grid-template-columns: 1fr; }
}

.dp-field--2col > div{
  background:#fff;
  border:1px solid rgba(15,23,42,.10);
  border-radius:12px;
  padding:10px 12px;
}

.dp-field input[type="color"]{
  width: 100%;
  height: 42px;
  padding: 0;
  border: 1px solid rgba(15,23,42,.12);
  border-radius: 12px;
  background: #fff;
  cursor: pointer;
}

#yith-wapo-container{
	width:96%;
}